jquery easyui滚动条部分设置介绍


Posted in Javascript onSeptember 12, 2013

在使用dialog插件时,默认是屏幕居中的,但是当页面出现滚动条时,dialog并没有随着滚动条往下滚动,这时就需要用户滑动滚动条来定位dialog,这不人性化,在说出解决方案前先来普及一下jquery关于定位的几个方法

//获取浏览器显示区域的高度 
$(window).height(); 
//获取浏览器显示区域的宽度 
$(window).width(); //获取页面的文档高度 
$(document.body).height(); 
//获取页面的文档宽度 
$(document.body).width(); 
//获取滚动条到顶部的垂直高度 
$(document).scrollTop(); 
//获取滚动条到左边的垂直宽度 
$(document).scrollLeft();

ok,下面问题就很好处理了,移动dialog有现成的函数,不过dialog本身没有move函数,但是dialog是继承自panel的,panel有move函数,因此可以调用panel的move函数来移动dialog
$('#dlg').dialog('open'); 
$("#dlg").panel("move",{top:$(document).scrollTop() + ($(window).height()-250) * 0.5});

其中 $(window).height()-250,这里250px是dialog的宽度。
Javascript 相关文章推荐
jquery 插件学习(五)
Aug 06 Javascript
JS的数组迭代方法
Feb 05 Javascript
Javascript编程之继承实例汇总
Nov 28 Javascript
Bootstrap3使用typeahead插件实现自动补全功能
Jul 07 Javascript
VUE axios发送跨域请求需要注意的问题
Jul 06 Javascript
以BootStrap Tab为例写一个前端组件
Jul 25 Javascript
浅谈node.js 命令行工具(cli)
May 10 Javascript
微信小程序实现上传图片功能
May 28 Javascript
微信小程序踩坑记录之解决tabBar.list[3].selectedIconPath大小超过40kb
Jul 04 Javascript
vue数据操作之点击事件实现num加减功能示例
Jan 19 Javascript
浅谈JavaScript窗体Window.ShowModalDialog使用
Jul 22 Javascript
vue自定义组件实现双向绑定
Jan 13 Vue.js
jquery实现盒子下拉效果示例代码
Sep 12 #Javascript
利用jquery包将字符串生成二维码图片
Sep 12 #Javascript
JQuery实现鼠标滑过显示导航下拉列表
Sep 12 #Javascript
JQuery加载图片自适应固定大小的DIV
Sep 12 #Javascript
JS鼠标滑过图片时切换图片实现思路
Sep 12 #Javascript
jQuery实现图片放大预览实现原理及代码
Sep 12 #Javascript
jquery foreach使用示例
Sep 12 #Javascript
You might like
基于thinkPHP类的插入数据库操作功能示例
2017/01/06 PHP
PHP实现阿里大鱼短信验证的实例代码
2017/07/10 PHP
jquery下onpropertychange事件的绑定方法
2010/08/01 Javascript
JavaScript性能陷阱小结(附实例说明)
2010/12/28 Javascript
Prototype源码浅析 Enumerable部分(二)
2012/01/18 Javascript
js 验证身份证信息有效性
2014/03/28 Javascript
原生Javascript封装的一个AJAX函数分享
2014/10/11 Javascript
JavaScript转换二进制编码为ASCII码的方法
2015/04/16 Javascript
javascript验证邮件地址和MX记录的方法
2015/06/16 Javascript
jquery append 动态添加的元素事件on 不起作用的解决方案
2015/07/30 Javascript
浅谈js中的三种继承方式及其优缺点
2016/08/10 Javascript
javascript实现动态显示颜色块的报表效果
2017/04/10 Javascript
详解webpack2+React 实例demo
2017/09/11 Javascript
基于jQuery ztree实现表格风格的树状结构
2018/08/31 jQuery
基于 jQuery 实现键盘事件监听控件
2019/04/04 jQuery
vue实现下拉加载其实没那么复杂
2019/08/13 Javascript
javascript中可能用得到的全部的排序算法
2020/03/05 Javascript
vue实现登录拦截
2020/06/29 Javascript
[09:34]2018DOTA2国际邀请赛寻真——永不放弃的iG
2018/08/14 DOTA
[00:52]DOTA2国际邀请赛
2020/02/21 DOTA
python和ruby,我选谁?
2017/09/13 Python
python学习之hook钩子的原理和使用
2018/10/25 Python
python 寻找离散序列极值点的方法
2019/07/10 Python
一篇文章弄懂Python中的可迭代对象、迭代器和生成器
2019/08/12 Python
python二进制读写及特殊码同步实现详解
2019/10/11 Python
redis数据库及与python交互用法简单示例
2019/11/01 Python
Pytorch保存模型用于测试和用于继续训练的区别详解
2020/01/10 Python
AUC计算方法与Python实现代码
2020/02/28 Python
python实现批量修改文件名
2020/03/23 Python
Django配置跨域并开发测试接口
2020/11/04 Python
Python调用系统命令os.system()和os.popen()的实现
2020/12/31 Python
浅谈Selenium+Webdriver 常用的元素定位方式
2021/01/13 Python
新西兰最大、占有率最高的综合性药房:PharmacyDirect药房中文网
2020/11/03 全球购物
《老王》教学反思
2014/02/23 职场文书
幼儿园爱国卫生月活动总结
2014/06/30 职场文书
2015年母亲节寄语
2015/03/23 职场文书