jQuery实现定位滚动条位置
jQuery实现滚动条滚动到子元素位置(方便定位)
关键代码如下所示:
<div class="of-y" id="nurse" > <table class="high width" id="nurse-plan"> <tr id="tr-one"></tr> <tr id="tr-two"></tr> <tr id="tr-three"></tr> <tr id="tr-four"></tr> </table> </div>
jQuery:
$("#nurse").scrollTop($("#nurse").scrollTop() + $('#tr-three').offset().top - $("#nurse").offset().top); --普通 $("#nurse").animate({ scrollTop: $("#nurse").scrollTop() + $('#tr-three').offset().top - $("#nurse").offset().top }, 1000); --有动画效果
以上所述是小编给大家介绍的jQuery实现定位滚动条位置,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!
相关推荐
-
jQuery实现将div中滚动条滚动到指定位置的方法
本文实例讲述了jQuery实现将div中滚动条滚动到指定位置的方法.分享给大家供大家参考,具体如下: 一.Js代码: onload = function () { //初始化 scrollToLocation(); }; function scrollToLocation() { var mainContainer = $('#thisMainPanel'), scrollToContainer = mainContainer.find('.son-panel:last');//滚动到<div
-
jQuery判断div随滚动条滚动到一定位置后停止
实现代码: 复制代码 代码如下: <script type="text/javascript">var rollSet = $('#widget'); var offset = rollSet.offset(); var fwidth = $("#footer").height(); $(window).scroll(function() { var scrollTop = $(window).scrollTop();
-
页面刷新时记住滚动条的位置jquery代码
@*点击按钮页面刷新的时候 记住滚动条的位置*@ 复制代码 代码如下: <script type="text/javascript"> window.onbeforeunload = function () { var scrollPos; if (typeof window.pageYOffset != 'undefined') { scrollPos = window.pageYOffset; } else if (typeof document.compatMode
-
jQuery实现滚动条滚动到子元素位置(方便定位)
话不多说,请看代码: <div class="of-y" id="nurse" > <table class="high width" id="nurse-plan"> <tr id="tr-one"></tr> <tr id="tr-two"></tr> <tr id="tr-three"
-
使用jQuery判断浏览器滚动条位置的方法
项目背景 webtouch(webapp)页面,防苹果手机safari浏览器,网上滑动,底部导航消失,滑动到底部又出现.向下滑动,底部导航出现. 遇到问题 1.我一开始用swipeup和swipedown来做,发现因为有滚动条,不会触发.因此只能判断滚动条是上滚下滚等.关于手机手势,后面的文章会介绍,欢迎关注! 2.通过上滚下滚来让底部导航显示或者因此,安卓上面的浏览器都可以,但是苹果safari会一闪一闪,原因是苹果safari自动有个弹跳效果,导致事件重复执行,解决办法是给上滚下滚一个距离,
-
jQuery弹出层后禁用底部滚动条(移动端关闭回到原位置)
最近在忙于jquery的前端开发,学习到很多知识,今天小编给大家带来一段代码片段有关弹出层后禁用滚动条的代码. 具体代码如下所示: $("cli-open").click(function(){ var scrollTop = document.body.scrollTop;//保存点击前滚动条的位置 window.onscroll=function(){ document.body.scrollTop = scrollTop;//赋值给滚动条的位置 } }) $(".cli
-
jQuery实现根据滚动条位置加载相应内容功能
实现jQuery根据滚动条位置加载相应的内容:向下滚动时当内容区域滚动到可视窗口高度的一半时,加载动画内容:向上滚动到相应的内容区域时也重新加载动画内容! 1.实现思路: 先静态布局好HTML结构,使用伪类:hover模拟动画效果,再使用jQuery 控制动画类名的切换来实现效果!主要判断滚动的方向,以及相应方向上加载动画的时机(即何时才加载动画的判断条件!关键点!). 2.思维草稿图: 向下滚动加载动画判断条件:(代码中addClass()函数) 向上滚动加载动画判断条件:(代码中addCla
-
通过JQuery将DIV的滚动条滚动到指定的位置方便自动定位
这里有一个方法可以将DIV的滚动条滚动到其子元素所在的位置,方便自动定位. 复制代码 代码如下: var container = $('div'), scrollTo = $('#row_8'); container.scrollTop( scrollTo.offset().top - container.offset().top + container.scrollTop() ); // Or you can animate the scrolling: container.animate({
-
jquery 点击元素后,滚动条滚动至该元素位置的方法
点击元素后,滚动条滚动至该元素位置: $('a.lead-link').bind('click', function(e) { e.preventDefault(); $('html,body').animate({ scrollTop: $(this.hash).offset().top - 60 }, 1500); }); 以上这篇jquery 点击元素后,滚动条滚动至该元素位置的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们.
-
JS和JQUERY获取页面大小,滚动条位置,元素位置(示例代码)
js与jquery获得页面大小.滚动条位置.元素位置 复制代码 代码如下: //页面位置及窗口大小 function GetPageSize() {var scrW, scrH; if(window.innerHeight && window.scrollMaxY) { // Mozilla scrW = window.innerWidth + window.scrollMaxX; scrH = window.innerHeight + window.scrollMaxY
-
JQuery获取元素文档大小、偏移和位置和滚动条位置的方法集合
因为浏览器的兼容问题,如果使用javascript获取这些数值是一个相当痛苦的过程.好在JQuery提供了简单优雅,并且兼容的解决方法. 获取浏览器和页面文档的宽度和高度 复制代码 代码如下: //获取浏览器显示区域的高度 $(window).height(); //获取浏览器显示区域的宽度 $(window).width(); //获取页面的文档高度 $(document.body).height(); //获取页面的文档宽度 $(document.body).width(); 获取滚动条的位
随机推荐
- PHP之uniqid()函数用法
- flash 报错捕获(Catch All Exception in Flash)
- 用批处理实现读取文本文件并实现超链接代码的输出 原创
- Javaweb项目session超时解决方案
- asp.net+jquery Jsonp使用方法
- JavaScript引用类型和基本类型详解
- Three.js利用性能插件stats实现性能监听的方法
- JQuery实现简单的服务器轮询效果实例
- PHP动态创建Web站点的方法
- PHP常量使用的几个需要注意的地方(谨慎使用PHP中的常量)
- 搜索引擎核心技术(PHP编程思路) --[1]
- android PopupWindow 和 Activity弹出窗口实现方式
- 老生常谈C++的单例模式与线程安全单例模式(懒汉/饿汉)
- jquery validate和jquery form 插件组合实现验证表单后AJAX提交
- shell 中数学计算总结
- C#实现图片上传与浏览切换的方法
- Mysql常见问题集锦
- jQuery EasyUI tree增加搜索功能的实现方法
- java不用循环语句打印数组元素的实例
- C#中派生类调用基类构造函数用法分析