jquery实现弹出层完美居中效果
代码如下:
function showDiv(obj){
$(obj).show();
center(obj);
$(window).scroll(function(){
center(obj);
});
$(window).resize(function(){
center(obj);
});
}
function center(obj){
var windowWidth = document.documentElement.clientWidth;
var windowHeight = document.documentElement.clientHeight;
var popupHeight = $(obj).height();
var popupWidth = $(obj).width();
$(obj).css({
"position": "absolute",
"top": (windowHeight-popupHeight)/2+$(document).scrollTop(),
"left": (windowWidth-popupWidth)/2
});
}
jquery实现弹出层完美居中效果的更多相关文章
- jquery制作弹出层带遮罩效果,点击阴影部分层消失
jquery制作弹出层带遮罩效果,点击阴影部分层消失. 整体还是比较简单的. HTML代码很简单 <a href="#" class="big-link" ...
- css+html+JQuery 万能弹出层,居中显示
function ShowMsg(str) {//要提示的文字 $(".payment_time_mask").remove(); $("body").appe ...
- jQuery Dialog弹出层对话框插件
Dialog.js的相关注释已经添加,可以按照注释,进行相关样式的修改,适用于自定义的各个系统! dialog.js /** * jQuery的Dialog插件. * * @param object ...
- jQuery.reveal弹出层
jQuery.reveal弹出层使用 最近用到弹出层,还得自定义UI,原本用的artDialog太庞大,不合适了,于是就找到了这个东西,又小又好用,基础的弹出遮罩都有了,想要什么还不是Coder自己说 ...
- layer弹出层不居中解决方案
layer弹出层不居中解决方案 代码头中加入以下代码即可 <!doctype html>
- layer弹出层不居中解决方案,layer提示不屏幕居中解决方法,layer弹窗不居中解决方案
layer弹出层不居中解决方案,layer提示不屏幕居中解决方法,layer弹窗不居中解决方案 >>>>>>>>>>>>> ...
- jquery 简单弹出层(转)
预定义html代码:没有 所有代码通过js生成和移除. 预定义css /* 基本弹出层样式 */ .my-popup-overlay { width:100%; height:auto; /* wid ...
- layer 弹出层 不居中
layer弹出层不居中解决方案 代码头中加入以下代码即可 <!doctype html>
- Jquery实现弹出层效果
<script type="text/javascript"> $(document).ready(function(){ $('.one').click(functi ...
随机推荐
- linux 下nc 命令的使用
linux 下nc 命令的使用 https://blog.51cto.com/samyubw/555247
- JPA的查询方法总结
一.使用where条件上一篇我们使用JPA进行了数据源的访问,默认JPA已经实现了好几个接口可以调用.但是,在实际的业务中,查询语句不可避免地需要使用where.order by等语句. 我们用商品数 ...
- kaggle, gmail, 烟雨朦胧
kaggle, gmail, 烟雨朦胧 刚才为了体验kaggle,用gmail重新登录,需要验证十几年前在桂林使用的手机号,竟然找到了,终于又可以上了. 那是一个在烟雨江南里努力奋斗而又迷失自我不堪回 ...
- Anaconda(三)
五.TensorFlow安装 这一天由于版本问题走了太多弯路.之前用的conda版本是最新的,自带Python3.7.5,装了之后倒是各种包都能装,用命令: pip install xxx conda ...
- 【APM】Pinpoint 监控告警(三)
本例介绍Pinpoint告警的相关内容,Pinpoint参考[APM]Pinpoint 安装部署(一) Pinpoint Web会定期检查应用程序的状态,并在满足某些预配置条件(规则)的情况下触发警报 ...
- Hive、Inceptor数据倾斜详解及解决
一.倾斜造成的原因 正常的数据分布理论上都是倾斜的,就是我们所说的20-80原理:80%的财富集中在20%的人手中, 80%的用户只使用20%的功能 , 20%的用户贡献了80%的访问量. 俗话是,一 ...
- Flask 学习(二)jinja2模板介绍
控制语句和表达式 举例 Flask Python代码 from flask import Flask, render_template, redirect, request app = Flask(_ ...
- WPF--控件模板的视觉效果呈现流程及逻辑
外部通过属性把数据--传递给-->(破拆后)内部可视化树 ----> 内部可视化树呈现出视觉效果 ----> 各种内部可视化组件的视觉效果组合 --- 呈现 --> 外部的 ...
- massif 图例
19.63^ ### | # | # :: | # : ::: | :::::::::# : : :: | : # : : : :: | : # : : : : ::: | : # : : : : : ...
- 【MongoDB学习之六】MongoDB集群
环境 MongoDB 4.0 CentOS 6.5_x64 一.主从复制-Master-Slave这种模式已不再推荐使用了. 二.副本集-Replica Set(用的多)副本集其实一种互为主从的关系, ...