<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script type="text/javascript" src="resource/jquery-1.9.1.min.js"></script>
</head>
<script type="text/javascript">
$(function(){
// $("#container").scrollTop($("#test5").scrollHeight ()); 不行 $("#container").scrollTop($("#test4").offset().top) });
</script>
<body style="text-align:center"> <!--
var div = document.getElementById('divDetail'); div.scrollTop = div.scrollHeight; --> <div id="container" style="width:430px;height:300px;background:#00FF00;overflow:auto">
<div id="test1" style="width:400px;height:300px;background:#FFFFFF">
</div>
<div id="test2" style="width:400px;height:300px;background:#000000">
</div>
<div id="test3" style="width:400px;height:300px;background:#00FF00">
</div>
<div id="test4" style="width:400px;height:300px;background:#0000FF">
</div>
<div id="test5" style="width:400px;height:300px;background:#FFFF00">
</div>
</div>
</body>
</html>

评论例如以下:

$("#container").scrollTop($("#test4").position().top + $("#container").scrollTop())

注意position和offset方法的差别。另外#container和#test4都须要设置定位方式,比方position:relative.

两个方法的定义。

offset():

获取匹配元素在当前视口的相对偏移。

返回的对象包括两个整形属性:top 和 left。此方法仅仅对可见元素有效。

position():

获取匹配元素相对父元素的偏移。

返回的对象包括两个整形属性:top 和 left。为精确计算结果,请在补白、边框和填充属性上使用像素单位。此方法仅仅对可见元素有效。

详情訪问:http://www.jb51.net/article/18340.htm

IE8 下,亲測可用

Div 滚动栏滚动到指定的位置的更多相关文章

  1. 如何通过JQuery将DIV的滚动条滚动到指定的位置

    这里有一个方法可以将DIV的滚动条滚动到其子元素所在的位置,方便自动定位. var container = $('div'), inner = $('#inner'); container.scrol ...

  2. div:给div加滚动栏 div的滚动栏设置

    今天做了个样例: div 的滚动栏问题: 两种方法: 一. <div style=" overflow:scroll; width:400px; height:400px;”>& ...

  3. scroll 滚动到指定位置触发事件 and 点击一按钮/链接让页面定位在指定的位置

    scroll 滚动到指定位置触发事件:$(function(){ $(window).scroll(function() { var s =$(window).scrollTop(); if (s&g ...

  4. Android ListView滚动到指定的位置

    这篇文章主要给大家介绍了Android中的ListView如何滚动到指定的位置,文章给出了两种解决的方法,并给出详细的示例代码,相信会对大家的理解和学习很有帮助,有需要的朋友们下面来一起看看吧. 本文 ...

  5. [RN] React Native 滚动跳转到指定位置

    React Native 滚动跳转到指定位置 一.结构 <ScrollView horizontal={true} ref={(view) => { this.myScrollView = ...

  6. JS控制div跳转到指定的位置的解决方案总结

    总结一下自己在写这个需求遇到的问题,相信大家应该是经常遇到的.即要求滚轮滚动到指定的位置.先看下基本的解决方案. 1.给链接a加个#的方式来实现跳转.(锚点方法)这里直接贴下代码: html页面: & ...

  7. 滚动栏范围位置函数(SetScrollRange、SetScrollPos、GetScrollRange、GetScrollPos)

    滚动栏的范围是一对整数,默认情况下,滚动栏的范围是0~100. SetScrollRange(hwnd,iBar,iMin,iMax,bRedraw)这里的iBar參数要么是SB_VERT,要么是SB ...

  8. html中滚动栏的样式

    DIV滚动栏设置 (CSS)2008/09/26 03:07div 中滚动栏的控制2008年01月06日 星期日 01:181)隐藏滚动栏<body style="overflow-x ...

  9. JS控制div跳转到指定的位置的几种解决方案总结

    原文:http://www.jb51.net/article/96574.htm 这篇文章主要介绍了JS控制div跳转到指定的位置的几种解决方案总结,小编觉得挺不错的,现在分享给大家,也给大家做个参考 ...

随机推荐

  1. (一)----使用HttpClient发送HTTP请求(通过get方法获取数据)

    (一)----使用HttpClient发送HTTP请求(通过get方法获取数据) 一.HTTP协议初探: HTTP(Hypertext Transfer Protocol)中文 “超文本传输协议”,是 ...

  2. php 上传文件 $_FILES['']['type']的值

    php 上传文件 $_FILES['']['type']的值 一个函数 function upload_file($fname,$ftype,$fsize,$ferror,$ftmp_name,$fp ...

  3. THashMD5,THashSHA1,THashBobJenkins,TIdHashMessageDigest5的用法

    [delphi] view plain copy unit Unit1; interface uses Winapi.Windows, Winapi.Messages, System.SysUtils ...

  4. ThinkPHP 自动创建数据、自动验证、自动完成详细例子介绍(十九)

    原文:ThinkPHP 自动创建数据.自动验证.自动完成详细例子介绍(十九) 1:自动创建数据 //$name=$_POST['name']; //$password=$_POST['password ...

  5. rzsz不能大于4G,securefx传5.2G没有问题,

    rzsz不能大于4G,securefx传5.2G没有问题, 查看系统限制: $ulimit -acore file size          (blocks, -c) 0data seg size  ...

  6. Linux下一个简单的日志系统的设计及其C代码实现

    1.概述 在大型软件系统中,为了监测软件运行状况及排查软件故障,一般都会要求软件程序在运行的过程中产生日志文件.在日志文件中存放程序流程中的一些重要信息, 包括:变量名称及其值.消息结构定义.函数返回 ...

  7. make 2>&1 | tee log.txt之小析

    前言 接触过linux的人,或多或少都会了解一点make 2>&1 | tee log.txt这个命令. 1. make是什么? make是linux下一个非常强大的命令,简单点就是你要 ...

  8. cocos2d-x3.2下使用Umeng 64位SDK注意事项

    友盟官方的样例中已经有了Cocos2d-x的Demo使用起来也是比較方便的.但在64位的版本号使用时须要注意 32位SDK改动: 将Xcode中Build Settings的Architectures ...

  9. 动态拼接lambda表达式树

    前言 最近在优化同事写的代码(我们的框架用的是dapperLambda),其中有一个这样很普通的场景——界面上提供了一些查询条件框供用户来进行过滤数据.由于dapperLambda按条件查询时是传入表 ...

  10. RGB與CIELAB色彩空間轉換

    原地址:http://cg2010studio.wordpress.com/2012/10/02/rgb與cielab色彩空間轉換/ 之前有研究CIE L*a*b*色彩空間,現在想更進一步探討RGB色 ...