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 相关文章推荐
js中将字符串转换成json的三种方式
Jan 12 Javascript
javascript中数组的多种定义方法和常用函数简介
May 09 Javascript
javascript生成随机数的方法
May 16 Javascript
jQuery选择器源码解读(八):addCombinator函数
Mar 31 Javascript
jquery实现隐藏在左侧的弹性弹出菜单效果
Sep 18 Javascript
谈谈Jquery中的children find 的区别有哪些
Oct 19 Javascript
利用JS实现页面删除并重新排序功能
Dec 09 Javascript
bootstrap table表格插件使用详解
May 08 Javascript
vue 每次渲染完页面后div的滚动条保持在最底部的方法
Mar 17 Javascript
详解解决使用axios发送json后台接收不到的问题
Jun 27 Javascript
Echarts地图添加引导线效果(labelLine)
Sep 30 Javascript
jquery实现进度条状态展示
Mar 26 jQuery
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代码审核的详细介绍
2013/06/13 PHP
php动态生成版权所有信息的方法
2015/03/24 PHP
PHP环形链表实现方法示例
2017/09/15 PHP
IE 条件注释详解总结(附实例代码)
2009/08/29 Javascript
JavaScript Accessor实现说明
2010/12/06 Javascript
DIY jquery plugin - tabs标签切换实现代码
2010/12/11 Javascript
jquery基础教程之deferred对象使用方法
2014/01/22 Javascript
js调试系列 控制台命令行API使用方法
2014/06/18 Javascript
JS数组的遍历方式for循环与for...in
2014/07/31 Javascript
常用的Javascript设计模式小结
2015/12/09 Javascript
js判断登陆用户名及密码是否为空的简单实例
2016/05/16 Javascript
JS实现仿PS的调色板效果完整实例
2016/12/21 Javascript
简单实现js放大镜效果
2017/07/24 Javascript
javascript+html5+css3自定义弹出窗口效果
2017/10/26 Javascript
jQuery 禁止表单用户名、密码自动填充功能
2017/10/30 jQuery
vue2.5.2使用http请求获取静态json数据的实例代码
2018/02/27 Javascript
详解Vue SPA项目优化小记
2018/07/03 Javascript
TypeScript类型声明书写详解
2019/08/28 Javascript
nodejs环境使用Typeorm连接查询Oracle数据
2019/12/05 NodeJs
[05:41]2014DOTA2西雅图国际邀请赛 小组赛7月10日TOPPLAY
2014/07/10 DOTA
python+opencv打开摄像头,保存视频、拍照功能的实现方法
2019/01/08 Python
python和pywin32实现窗口查找、遍历和点击的示例代码
2020/04/01 Python
Python命名空间namespace及作用域原理解析
2020/06/05 Python
基于python 将列表作为参数传入函数时的测试与理解
2020/06/05 Python
python 操作excel表格的方法
2020/12/05 Python
CSS伪类与CSS伪元素的区别及由来具体说明
2012/12/07 HTML / CSS
HTML5 canvas实现雪花飘落特效
2016/03/08 HTML / CSS
AmazeUI导航的示例代码
2020/08/14 HTML / CSS
英国折扣零售连锁店:QD Stores
2018/12/08 全球购物
2014学雷锋活动心得体会
2014/03/10 职场文书
网站客服岗位职责
2014/04/05 职场文书
镇政府副镇长群众路线专题民主生活会对照检查材料
2014/09/19 职场文书
焦裕禄纪念馆观后感
2015/06/09 职场文书
少年雷锋观后感
2015/06/10 职场文书
2016秋季运动会前导词
2015/11/25 职场文书
Python基础之数据结构详解
2021/04/28 Python