手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >jQuery实现将div中滚动条滚动到指定位置的方法
jQuery实现将div中滚动条滚动到指定位置的方法
摘要:本文实例讲述了jQuery实现将div中滚动条滚动到指定位置的方法。分享给大家供大家参考,具体如下:一、Js代码:onload=functi...

本文实例讲述了jQuery实现将div中滚动条滚动到指定位置的方法。分享给大家供大家参考,具体如下:

一、Js代码:

onload = function () { //初始化 scrollToLocation(); }; function scrollToLocation() { var mainContainer = $('#thisMainPanel'), scrollToContainer = mainContainer.find('.son-panel:last');//滚动到<div id="thisMainPanel">中类名为son-panel的最后一个div处 //scrollToContainer = mainContainer.find('.son-panel:eq(5)');//滚动到<div id="thisMainPanel">中类名为son-panel的第六个处 //非动画效果 //mainContainer.scrollTop( // scrollToContainer.offset().top - mainContainer.offset().top + mainContainer.scrollTop() //); //动画效果 mainContainer.animate({ scrollTop: scrollToContainer.offset().top - mainContainer.offset().top + mainContainer.scrollTop() }, 2000);//2秒滑动到指定位置 }

二、Html代码:

<div id="thisMainPanel"> <div>我是类容区域-1</div> <div>我是类容区域-2</div> <div>我是类容区域-3</div> <div>我是类容区域-4</div> <div>我是类容区域-5</div> <div>我是类容区域-6</div> <div>我是类容区域-7</div> <div>我是类容区域-8</div> </div>

希望本文所述对大家jQuery程序设计有所帮助。

【jQuery实现将div中滚动条滚动到指定位置的方法】相关文章:

Jquery实现动态切换图片的方法

Javascript实现每日自动换一张图片的方法

javascript实现动态改变层大小的方法

javascript实现模拟时钟的方法

jQuery实现表格行上下移动和置顶效果

jQuery实现不断闪烁文字的方法

基于jQuery插件实现环形图标菜单旋转切换特效

Javascript实现飞动广告效果的方法

javascript实现行拖动的方法

jQuery实现限制textarea文本框输入字符数量的方法

精品推荐
分类导航