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 相关文章推荐
网页里控制图片大小的相关代码
Jun 25 Javascript
Prototype 学习 Prototype对象
Jul 12 Javascript
几个比较实用的JavaScript 测试及效验工具
Apr 18 Javascript
jquery学习笔记 用jquery实现无刷新登录
Aug 08 Javascript
javascript回车完美实现tab切换功能
Mar 13 Javascript
使用jQuery重置(reset)表单的方法
May 05 Javascript
js在IE与firefox的差异集锦
Nov 11 Javascript
jquery模拟进度条实现方法
Aug 03 Javascript
javascript中arguments,callee,caller详解
Mar 16 Javascript
JS实现列表页面隔行变色效果
Mar 25 Javascript
jquery无缝图片轮播组件封装
Nov 25 jQuery
vue中axios实现数据交互与跨域问题
May 12 Javascript
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
将PHP作为Shell脚本语言使用
2006/10/09 PHP
php中eval函数的危害与正确禁用方法
2014/06/30 PHP
PHP实现的分页类定义与用法示例
2017/07/05 PHP
PHP $O00OO0=urldecode & eval 解密,记一次商业源码的去后门
2020/09/13 PHP
JavaScript网页制作特殊效果用随机数
2007/05/22 Javascript
基于Jquery的仿照flash放大图片效果代码
2011/03/16 Javascript
jQuery ajax dataType值为text json探索分享
2013/09/23 Javascript
浏览器的JavaScript引擎的识别方法
2013/10/20 Javascript
js函数参数设置默认值的一种变通实现方法
2014/05/26 Javascript
使用JavaScript+canvas实现图片裁剪
2015/01/30 Javascript
jquery操作select方法汇总
2015/02/05 Javascript
基于Vue实现后台系统权限控制的示例代码
2017/08/29 Javascript
weex里Vuex state使用storage持久化详解
2017/09/09 Javascript
使用JS模拟锚点跳转的实例
2018/02/01 Javascript
解决vue中修改了数据但视图无法更新的情况
2018/08/27 Javascript
Vue slot用法(小结)
2018/10/22 Javascript
Node.js在图片模板上生成二维码图片并附带底部文字说明实现详解
2019/08/07 Javascript
RxJS在TypeScript中的简单使用详解
2020/04/13 Javascript
[38:44]DOTA2上海特级锦标赛A组小组赛#2 Secret VS CDEC第二局
2016/02/25 DOTA
pycharm远程调试openstack代码
2017/11/21 Python
Python设计模式之命令模式简单示例
2018/01/10 Python
解决使用pycharm提交代码时冲突之后文件丢失找回的方法
2018/08/05 Python
Python实现爬取亚马逊数据并打印出Excel文件操作示例
2019/05/16 Python
Python使用百度翻译开发平台实现英文翻译为中文功能示例
2019/08/08 Python
Python运行DLL文件的方法
2020/01/17 Python
Python包资源下载路径报404解决方案
2020/11/05 Python
美国婚礼和派对礼品网站:Kate Aspen(新娘送礼会、迎婴派对)
2018/03/28 全球购物
宝拉珍选官方旗舰店:2%水杨酸精华液,收缩毛孔粗大和祛痘
2018/07/01 全球购物
澳大利亚在线家具、灯饰和家居装饰店:LivingStyles
2018/11/20 全球购物
在什么时候需要使用"常引用"
2015/12/31 面试题
中学生爱国演讲稿
2013/12/31 职场文书
25岁生日感言
2014/01/13 职场文书
家长给老师的道歉信
2014/01/13 职场文书
2014年工商所工作总结
2014/12/09 职场文书
学生不参加考试检讨书
2015/02/19 职场文书
实践论读书笔记
2015/06/29 职场文书