弹出框设置在页面居中

思路:

  1.获取当前页面的高和宽、针对顶部和左侧的滑动距离。

  2.将弹出框的位置设为绝对位置。

      3.设置弹出框针对屏幕的左侧和顶部的距离。

代码:

html :

   <div class="dialog">

   ......   //模态框内容   

   </div>

css: .dialog{ position:abosulte;......}

script: var showDialog(){

  var objW = $(window);

  var objC = $(".dialog");

  var brsW = objW.width();

  var brsH = objW.height();

  var sclL = objW.scrollLeft();

  var sclT = objW.scrollTop();

  var curW = objC.width();

  var curH = objC.height();

  var left = scrlL + (brsW - curW)/2;

  var top = scrlT + (brsH - curH)/2;

  objC.css("left":left,"top":top);

}

ps:$(window).resize(function(){//页面窗口大小改变事件

  showDialog();

});

转载于:https://www.cnblogs.com/hjlblog/p/5626533.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/430421.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

杂牌手柄模拟xboxone手柄_震了,Xbox One 精英手柄2代摸了一次就不舍得放下了

首发于机核网&#xff0c;作者xizongbu近日我有幸提前拿到了微软 Xbox One 的精英手柄2代&#xff0c;这款产品在 E3 2019 微软展前发布会上正式公开&#xff0c;相信不少追求操作极致体验的玩家早就望眼欲穿了。更多的定制空间&#xff0c;更细致入微的体验优化&#xff0c;Xb…

Microsoft Hololens开发上手(4)

磨刀不误砍柴功&#xff0c;我们总有一些小工程师&#xff0c;不了解全貌&#xff0c;不好好思考&#xff0c;上手就开始写代码&#xff0c;这种做法是非常不可取的。对于Hololens的开发也是一样。今天我们来重点看看Hololens里面的一些概念&#xff0c;比如Holograms, 坐标系,…

wo-27s管理员账户和密码_Mac管理员忘记密码怎么办?

在使用Mac电脑时&#xff0c;为了安全很多用户通常都会设置管理员密码。不过如果不小心忘记Mac管理员密码怎么办&#xff1f;幸运的是&#xff0c;有些方法可以重置Mac密码并重新获得访问权限。下面小编就教给大家几种重置用户密码的方法。未开启FileVault的用户方法一&#xf…

嵌入式linux调试技术

Android模拟器只能通过端口映射的方式使用kgdbserver调试程序。但开发板除了可以通过ip连接到kgdbserver外还可以通过串口进行连接。开发板同样也带了kgdbserver程序&#xff0c;可直接运行。 大多数开发人员认为kgdb是最好的内核调试工具。Kgdb除了提供类似的printk函数的日志…

电脑怎么彻底删除软件_电脑在使用的过程中如何彻底删除今日热点广告弹窗的方法...

电脑在使用的过程中如何彻底删除今日热点广告弹窗的方法在今日热点弹窗弹出来之后&#xff0c;我们在键盘上同时按下“CtrlAltDel”键&#xff0c;调出“任务管理器”&#xff0c;在任务管理器进程找到“今日热点”&#xff0c;我们右键点击“今日热点”选择“打开文件所在的位…

Spring基础学习笔记-Bean的基础知识

一、 Bean的定义&#xff0c;初始化&#xff0c;使用和销毁 二、ref指定依赖的三种模式 三、Bean的五种自动装配模式&#xff08;autowire&#xff09; 四、Bean依赖检查的4种模式:配合atuowire使用,dependency-check"" 五、集合的注入方式 六、管理Bean config.xml文…

不用电脑怎么设置苹果铃声_苹果手机怎么设置铃声?完整教程分享

很多人的苹果手机铃声设置的都是用原始默认的铃声&#xff0c;因为苹果手机不支持直接将音乐设置为铃声&#xff0c;而且大多数人不清楚苹果怎么换铃声。当然安卓系统就没有这个问题啦。但是苹果的默认铃声听久了也挺腻的&#xff0c;鉴于有不少粉丝在问苹果手机怎么设置铃声&a…

mysql优化之连接优化

Posted by Money Talks on 2012/02/23 | 第一篇 序章第二篇 连接优化第三篇 索引优化第四篇 查询优化第五篇 到实战中去 连接优化 连接优化主要指客户端连接数据库以及数据库为响应客户端的请求而打开数据表和索引的过程中涉及到的参数调整。原文可以参考这里或者这里。(原文链…

家用电脑配置_游戏搬砖必看教程,游戏工作室电脑如何配置

文章只针对新手对电脑硬件配置了解&#xff0c;大佬可直接关闭&#xff0c;电脑如何配置只代表个人观点!想游戏搬砖赚钱&#xff0c;资金方面也有这个能力的小伙伴可能对手机开那么几个号无法满足&#xff0c;那么今天要说的就是如何利用电脑多开&#xff0c;来达到利益最大化这…

基于MATLAB的Dijkstra算法实现及案例分析

摘要:为研究两地点之间距离&#xff08;或耗时&#xff09;最短路线规划&#xff0c;采用MATLAB编程的方法来实现&#xff0c;并利用Floyd算法记录距离&#xff08;或耗时&#xff09;最短路线。在不考虑各种影响因素的情况下&#xff0c;以随机小样本数据为例进行演示&#xf…

面试题19:二叉树镜像

递归方法非常简单&#xff1a; 1 void MirrorRecursively(BinaryTreeNode *pNode)2 {3 if((pNode NULL) || (pNode->m_pLeft NULL && pNode->m_pRight))4 return;5 6 BinaryTreeNode *pTemp pNode->m_pLeft;7 pNode->m_pLeft pNod…

win10共享打印机怎么设置_关于win10网络共享,选择“启用文件和打印机共享”之后,无法保存设置的解决办法...

写个流水账&#xff0c;把我解决这个问题的前因后果记录一下&#xff0c;供遇到相同问题的同学参考之用&#xff0c;希望能有点启发。这个问题的来源&#xff0c;是我想利用客厅的小米盒子&#xff0c;访问同一个路由器局域网之下的pc&#xff0c;直接访问共享文件的方式&#…

MATLAB中BP神经网络用于回归拟合算法实现(另附GRNN代码)

BP神经网络&#xff1a;是1986年由Rumelhart和McClelland为首的科学家提出的概念&#xff0c;是一种按照误差逆向传播算法训练的多层前馈神经网络&#xff0c;是目前应用最广泛的神经网络。神经网络是把生活中的常见情节推广到计算仿真的范畴&#xff0c;这样的启发式算法还有许…

前端性能优化知识,包括css和js

作者&#xff1a;野次链接&#xff1a;http://www.zhihu.com/question/33032042/answer/95948831来源&#xff1a;知乎著作权归作者所有。商业转载请联系作者获得授权&#xff0c;非商业转载请注明出处。 1. 减少HTTP请求次数 尽量合并图片、CSS、JS。比如加载一个页面&#xf…

快速理解编程结构_为什么系统编程全都用英文而不用中文?听完专家的解释恍然大悟!...

全球博弈(quanqiuboyi)——不一样的观点&#xff0c;不一样的解读&#xff0c;8000万人订阅的超级微信大号。不关注时事&#xff0c;你将会被这个世界抛弃&#xff0c;点击标题下蓝字“全球博弈”关注&#xff0c;我们将为您提供有价值、有意思的时事解读。人类走进科技发展的道…

用了十年的昵称badboy_怎样用5秒钟看清一对夫妻的真实感情状况?

“只要一分钟&#xff0c;我就能看清一对夫妻感情的状况。”从事情感咨询几十年的行业前辈告诉我&#xff0c;她的诀窍就是——听他们之间如何称呼对方。“大部分情侣在恋爱时都会给对方起一个专属的爱称&#xff0c;比如&#xff1a;小白猪、大宝宝之类的&#xff0c;总之很亲…

MATLAB—经纬度坐标转换为平面坐标

原理示意图&#xff1a; Mercator投影变换示意图 2. 公式: XY平面被当作Mercator投影平面&#xff0c;Y轴和X轴原点分别设为0纬度和0经度。通过如下公式将地理坐标变换到Mercator投影平面。由于标准电子海图/航道图使用WGS84坐标系&#xff0c;本文使用WGS84参数进行变换。投影…

java.util.TimeZone 新加方法 getTimeZone(ZoneId zoneId) 导致的问题

最近接受的项目中用spring配置了一个TimeZone对象&#xff1a; <bean id "timeZone4Job" class"java.util.TimeZone" factory-method"getTimeZone"><constructor-arg value"GMT8:00"/> </bean> 以前是运行在 1.7 中…

io密集型和cpu密集型_和小胖一起理解CPU负载和利用率

作者&#xff1a;小胖前言凌晨一点&#xff0c;正整着炸鸡的小胖&#xff0c;微信一呼“你的服务器CPU持续超载 … “麻溜的连上服务器&#xff0c;先把CPU负载摁下来。仔细一想&#xff0c;最近1分钟平均负载很大&#xff0c;但CPU利用率却≤30%&#xff0c;不经陷入了深思&am…

gui显示文本动态框

软件文本框&#xff0c;显示一些希望被阅读的文本&#xff1b; 包含main函数(kuang)&#xff0c;gui作为子函数&#xff0c;以及必要的txt文件。 直接运行kuang函数即可。时间0.5秒内。 可以顺序显示希望输入的内容&#xff0c;并保存记录&#xff0c;如下 也可以每次只显示新…