直接上代码
$(function() { function center_pos(){ var width = $('.dialog').width(); var height = $('.dialog').height(); var top = (getInner().height - height) / 2 + getScroll().top; var left = (getInner().width - width) / 2 +getScroll().left; $('.dialog').css({ 'top': top, 'left': left }); } $(window).bind('load',center_pos); $(window).bind('resize',center_pos); });
封装之后:
/*** * make dialog in center */ com.whuang.hsj.centerJQueryPos = function ($div22, isApplyVertical) { var width = $div22.width(); var height = $div22.height(); var top = (getInner().height - height) / 2 + com.whuang.hsj.getScroll().top; var left = (getInner().width - width) / 2 + com.whuang.hsj.getScroll().left; var param = {'left': left}; if (arguments.length === 1 || isApplyVertical) {//Vertical direction param['top'] = top; } $div22.css(param); };//centerJQueryPos
依赖的js方法:
//Cross browser gets the size of Visual area window,Have nothing to do with scroll bars var getInner=(function() { // alert(typeof window.innerWidth !== 'undefined'); if (typeof window.innerWidth !== 'undefined') {//Notice:'undefined' is right return function(){ return { width : window.innerWidth, height : window.innerHeight } } } else { return function(){ return { width : document.documentElement.clientWidth, height : document.documentElement.clientHeight } } } })(); //Cross browser gets the position of scroll com.whuang.hsj.getScroll=function(){ return { top:document.documentElement.scrollTop || document.body.scrollTop, left:document.documentElement.scrollLeft || document.body.scrollLeft, height:document.documentElement.scrollHeight ||document.body.scrollHeight }; };
相关推荐
js 实现 打开的窗口居中! 值得下载看看!资源免费,大家分享!!
js 特效 html 特效 打开窗口居中js 特效 html 特效 打开窗口居中
NULL 博文链接:https://272426068.iteye.com/blog/690981
NULL 博文链接:https://fanshuyao.iteye.com/blog/2428837
弹出位置居中显示的新窗口JS代码,根据屏幕大小可以自动调节新窗口大小。
打开窗口居中.rar打开窗口居中.rar打开窗口居中.rar打开窗口居中.rar打开窗口居中.rar打开窗口居中.rar
让新窗口居中显示 点击新窗口 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
主要介绍了JS实现弹出居中的模式窗口,涉及javascript模式窗口及页面元素的动态操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下
窗口的缩小居中.rar窗口的缩小居中.rar窗口的缩小居中.rar窗口的缩小居中.rar窗口的缩小居中.rar窗口的缩小居中.rar
有js+css和jquery+css实现的弹出居中的遮罩层,兼容IE6 7 8 和ff
js+css 实现遮罩居中弹出层(随浏览器窗口滚动条滚动).docx
层垂直居中于浏览器,一直是新手朋友比较头疼的问题。 其实解决的思路是这样的:首们需要position:absolute;绝对定位。而层的定位点,使用外补丁margin负值的方法。负值的大小为层自身宽度高度除以二。 如:一个...
javascript弹出窗口居中代码 下面给两个弹出屏幕居中窗口的例子 代码如下:window.open()方式 function ShowDialog(url) { var iWidth=300; //窗口宽度 var iHeight=200;//窗口高度 var iTop=(window.screen.height...
1. 弹出绝对居中层 2. 企业级应用标准,支持SharePoint 3. 基于ASP.ENT, JavaScript, CSS开发
原生js实现点击小图放大居中,窗口变大变小不影响效果(html文件)--原生js实现点击小图放大居中,窗口变大变小不影响效果
http://blog.csdn.net/qqyangwang/article/details/8513662 文章的源码,欢迎下载。
弹出层内含窗口且居中,在本例使用原生js来实现,与网上的有所不一样,大家不妨参考下
Jquery弹出div层窗口以及div屏幕居中, 背景滤镜效果, div拖拽效果 在IE和FireFox测试通过!
VB设定窗口在屏幕中的位置,一共有五个位置可以设定:左上角、左下角、右上角、右下角、居中。窗体缺省值不必考虑,这里主要告诉新手如何在窗口固定在某一位置,在WEB编程的JavaScript中,这是相对简单的常规功能。