zoukankan      html  css  js  c++  java
  • 弹出窗口居中显示


    $(function() {
        // 居中
        function center(obj) {       
            var screenWidth = $(window).width(), screenHeight = $(window).height();  //当前浏览器窗口的 宽高
            var scrolltop = $(document).scrollTop();//获取当前窗口距离页面顶部高度   
            var objLeft = (screenWidth - obj.width())/2 ;
            var objTop = (screenHeight - obj.height())/2 + scrolltop;

            obj.css({left: objLeft + 'px', top: objTop + 'px'});
           
            //浏览器窗口大小改变时
            $(window).resize(function() {
                screenWidth = $(window).width();
                screenHeight = $(window).height();
                scrolltop = $(document).scrollTop();
               
                objLeft = (screenWidth - obj.width())/2 ;
                objTop = (screenHeight - obj.height())/2 + scrolltop;
               
                obj.css({left: objLeft + 'px', top: objTop + 'px'});
               
            });
            
            //浏览器有滚动条时的操作
            $(window).scroll(function() {
                screenWidth = $(window).width();
                screenHeight = $(window).height();
                scrolltop = $(document).scrollTop();
               
                objLeft = (screenWidth - obj.width())/2 ;
                objTop = (screenHeight - obj.height())/2 + scrolltop;
               
                obj.css({left: objLeft + 'px', top: objTop + 'px'});
            });
           
        }
        
        //点击显示
        $('.wechat img').click(function() {       
            $('.mask , .bring').show();
            center($('.bring'));
        });
        
        
        //隐藏的操作
        $(".bring img").click(function(){
            $(".mask , .bring").hide();
            });
       
    });

  • 相关阅读:
    HashMap实现原理
    框架-Spring
    团队开发介绍
    返回一个环状整数数组中最大子数组之和
    软件工程学习体会
    书店促销
    寻找小水王
    梦断代码阅读笔记3
    找水王
    梦断代码阅读笔记2
  • 原文地址:https://www.cnblogs.com/qdmaomao/p/4701315.html
Copyright © 2011-2022 走看看