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();
            });
       
    });

  • 相关阅读:
    1039 到底买不买 (20分)
    流密码
    Socket网络编程:互相通讯
    1036 跟奥巴马一起编程
    1033 旧键盘打字
    1029 旧键盘
    1015 德才论 (25分)
    BUU_Real_刷题记录
    vue3 composition api 对比 react hooks
    vue3 文档相关
  • 原文地址:https://www.cnblogs.com/qdmaomao/p/4701315.html
Copyright © 2011-2022 走看看