jquery封装(-)
来源:互联网 发布:nginx后端服务器监控 编辑:程序博客网 时间:2024/06/07 22:37
页面弹窗的写法:
<div class="pop-bg">
<div class="pop"></div>
</div>
.pop-bg{width: 100%; height:100%; overflow-y:scroll; position:fixed; top:0; left:0; background:rgba(66,66,66,.5);}
.pop{width: 660px;position:relative;background:#fff;margin:auto;}
因为每个div.pop的高度可能不同,所以需要动态设置div.pop在可视窗口内上下居中,此时需封装一个函数:
<script type="text/javascript">
// 扩展jQuery,显示窗口并窗口居中
$.fn.showCenter = function(params){
var thisWOb = $(this).parent();
if (typeof(params) != 'undefined' &&
typeof(params.isShowParent) &&
params.isShowParent == false) {
// 为false的时候,选择本身
thisWOb = $(this);
}
//params,所传递的参数
//isShowParent,所传递的参数的key
//false,所传递的参数的key值
// 显示出来了,才能准确设置div.pop的上下位置
thisWOb.fadeIn();
// div.pop的高度
var selfHeight = $(this).outerHeight();
// 得到窗口的高度
var windowHeight = $(window).height();
var c = (parseFloat(windowHeight) - parseFloat(selfHeight)) / 2;
if (c >= 0) {
$(this).css('top', c);
} else {
$(this).css('top', 0);
}
}
</script>
调用方法具体为:$("#transaction-pop-bg .pop").showCenter();
- jquery封装(-)
- jquery封装
- 封装jQuery
- jquery.datables过滤封装(一)
- Jquery封装之----事件绑定(一)
- jquery.datables过滤封装(一)
- jQuery插件开发模式(组件封装)
- jquery封装之--css封装
- 封装jquery弹出窗口
- jquery封装对话框插件
- jquery 时间封装包
- jQuery 的封装方法
- jquery 插件封装
- jQuery 插件开发 封装
- jquery封装jqgrid插件
- jQuery自定义类封装:
- jquery插件封装
- jquery 插件封装总结
- Git和SVN共存的方法
- 康拓展开+康拓展开的逆运算
- PIMPL实现String(pointer to implementation)
- CF803C:Maximal GCD(思维 & 构造)
- css艺术字效果,渐变字
- jquery封装(-)
- 基于Canvas绘制的图表
- AnyRTC全新开源项目助力直播
- IntelliJ Idea 常用快捷键列表
- Python相关文章索引(7)
- Arcgis---将坐标不同的图层显示在同一个ArcScene中
- [深度学习]RCNNs系列(2)RCNN介绍
- UNIX再学习 -- 线程控制
- 从零开始在阿里云上搭建服务器(CentOS 6.8系统)