function ScrollDiv() {    
    var ex = document.getElementById("calm");  
        ex.scrollTop = ex.scrollHeight;   
 }

obj.scrollTop：滚动条距离顶部的位置
obj.scrollHeight：流动区域的高度

给DIV添加滚动条
直接为div指定overflow属性为auto即可，但是必须指定div的高度，如下：
<div style="position:absolute; height:400px; overflow:auto">
</div>
如果要出现水平滚动条，则： overflow-x:auto
同理，垂直滚动条为： overflow-y:auto
如果该div被包含在其他对象例如td中，则位置可设为相对：position:relative
<HTML> 
<HEAD> 
<TITLE>测试表格内的滚动条</TITLE> 
</HEAD>

<BODY> 
<table>
  <tr>
    <td>表格内的滚动条:</td>
    <td>
      <div id="wins" 
        style="position:absolute;height:200;width:200;overflow:auto;background:#EEEEEE;"> 
        <p>pppppppppppppppppppppppppppppppppppppppppppppppppp </p> 
        <p>pppppppppppppppppppppppppppppppppppppppppppppppppp </p> 
        <p>ppppppppppppppppppppppppp </p> 
        <p>ppppppppppppppppppppppppp </p> 
        <p>ppppppppppppppppppppppppp </p> 
        <p>ppppppppppppppppppppppppp </p> 
        <p>ppppppppppppppppppppppppp </p> 
        <p>ppppppppppppppppppppppppp </p> 
        <p>ppppppppppppppppppppppppp </p> 
        <p>ppppppppppppppppppppppppp </p> 
        <p>ppppppppppppppppppppppppp </p> 
        <p>ppppppppppppppppppppppppp </p> 
      </div>
    </td>
  </tr>
  <tr>
    <td colspan="2" align="right">
      <span onmouseover='scrollb=setInterval("wins.scrollLeft-=10",100)' 
                 onmouseout=clearInterval(scrollb)>向左</span> 
            <span onmouseover='scrollb=setInterval("wins.scrollTop-=10",100)' 
                        onmouseout=clearInterval(scrollb)>向上</span>
      <span onmouseover='scrollb=setInterval("wins.scrollLeft+=10",100)' 
                 onmouseout=clearInterval(scrollb)>向右</span>
      <span onmouseover='scrollb=setInterval("wins.scrollTop+=10",100)' 
                 onmouseout=clearInterval(scrollb)>向下</span>
    </td>
  </tr>
</table>
</BODY> 
</HTML>

<!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=utf-8" />

<title>JS控制DIV滚动条</title>

</head>

<script>

function scrollup()

{

document.getElementById('div1').scrollTop = document.getElementById('div1').scrollTop-25;

}

function scrolldown()

{

document.getElementById('div1').scrollTop = document.getElementById('div1').scrollTop+25;

}

function scrolltop()

{

document.getElementById('div1').scrollTop = 0;

}

function scrollbottom()

{

document.getElementById('div1').scrollTop = document.getElementById('div1').scrollHeight;

}

</script>

<style>

.div1

{

height:200px;

overflow-y:scroll;

width:400px;

border:solid 1px #ccc;

}

</style>

<body>

<div class="div1" id="div1"><br />

start<br />

<br /><br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

middle<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

end<br />

</div>

<input name="" type="button"  value="向上"/ onclick="scrollup();">

<input name="" type="button"  value="向下" onclick="scrolldown();"/>

<input name="" type="button"  value="顶"/ onclick="scrolltop();">

<input name="" type="button"  value="底" onclick="scrollbottom();"/>

</body>

</html>

如何定位到div滚动条的最底端的更多相关文章

  1. DIV设置滚动条在最底端

    网站聊天样式,无论添加什么内容div的滚动条都显示在最底端 将div添加滚动条,给div一定的高度 <div id='up' style='height:100px; width:400px;o ...

  2. Selenium2+python自动化26-js处理内嵌div滚动条

    前言 前面有篇专门用js解决了浏览器滚动条的问题,生活总是多姿多彩,有的滚动条就在页面上,这时候又得仰仗js大哥来解决啦. 一.内嵌滚动条 1.下面这张图就是内嵌div带有滚动条的样子,记住它的长相.

  3. FireFox火狐浏览器与IE兼容问题 - 透明滤镜 DIV滚动条

    问题一:最简单的鼠标移过手变型的css要改了 cursor:pointer;/*FireFox(火狐)不支持cursor:hand*/ dw8下面自动出来的也没有hand这个属性了,标准的是point ...

  4. 2.24 js处理内嵌div滚动条

    2.24 js处理内嵌div滚动条 前言    前面有篇专门用js解决了浏览器滚动条的问题,生活总是多姿多彩,有的滚动条就在页面上,这时候又得仰仗js大哥来解决啦.一.内嵌滚动条    1.下面这张图 ...

  5. Selenium2学习（十八）-- js处理内嵌div滚动条

    前言 前面有篇专门用js解决了浏览器滚动条的问题,生活总是多姿多彩,有的滚动条就在页面上,这时候又得仰仗js大哥来解决啦. 一.内嵌滚动条 1.下面这张图就是内嵌div带有滚动条的样子,记住它的长相. ...

  6. Selenium2+python自动化26-js处理内嵌div滚动条【转载】

    前言 前面有篇专门用js解决了浏览器滚动条的问题,生活总是多姿多彩,有的滚动条就在页面上,这时候又得仰仗js大哥来解决啦. 一.内嵌滚动条 1.下面这张图就是内嵌div带有滚动条的样子,记住它的长相.

  7. div滚动条演示

    <!DOCTYPE html> <html> <head> <meta charset="gb2312" /> <title& ...

  8. css pre如果同时运用了css的border-radius、 overflow两个属性且标签中内容太多时,外部div滚动条在firefox下滚动时很卡

    pre如果同时运用了css的border-radius. overflow两个属性且标签中内容太多时,外部div滚动条在firefox下滚动时很卡. 解决方法:去掉css中border-radius. ...

  9. 【前端】webkit内核浏览器DIV滚动条样式修改和设置

    webkit内核浏览器DIV滚动条样式修改和设置 引言: 最近在做自己的小项目,为了设计出好看的页面费劲了心思,大到页面的整体布局,小到DIV的滚动条都不放过,以下是我通过查阅资料总结的webkit内 ...

随机推荐

  1. 【转】Android中的颜色设置

    原文网址:http://www.cnblogs.com/bluestorm/p/3644669.html 1.在android中经常看到设置的颜色为八位的十六进制的颜色值,例如: 1 2 3 publ ...

  2. AngularJS 拦截器和好棒例子

    目录[-] 什么是拦截器? 异步操作 例子 Session 注入(请求拦截器) 时间戳(请求和响应拦截器) 请求恢复 (请求异常拦截) Session 恢复 (响应异常拦截器) 总结 Intercep ...

  3. java并发之CountDownLatch、Semaphore和CyclicBarrier

    JAVA并发包中有三个类用于同步一批线程的行为,分别是CountDownLatch.Semaphore和CyclicBarrier. CountDownLatch Java之CountDownLatc ...

  4. Zabbix探索：Zabbix API使用时的错误1

    好久没来了,最近比较疲倦,估计是从年初到现在没有休息的原因. 刚刚批量导入网络设备到Zabbix时,报错: Cannot implode expression 后面自然是IP和触发器的表达式. 最初还 ...

  5. 无状态、REST、RESTful 和 Web Services【整理】

    在理解 OpenStack 的过程中,常常遇到 REST 这个概念,现从各处搜罗如下: 对 Web Service 的理解: Web 服务有点像对计算机友好的网页,基于让程序可以跨网络交换信息的标准和 ...

  6. uva 12304

    题意:要求解答6个关于圆的问题. 1.给出三角形坐标求外接圆 2.给出三角形坐标求内切圆 3.给出一个圆心和半径已知的圆,求过点(x,y)的所有和这个圆相切的直线 4.求所有和已知直线相切的过定点(x ...

  7. Good Bye 2015 C - New Year and Domino

    题意:计算给定矩形面积(r1,c1),(r2,c2)内长度为2的有多少个?向右或向下计算. 思路:预处理字符.分别向右和向下处理.注意边界情况,可能算多了.用容斥原理计算长度为二的单位. #inclu ...

  8. 【转】 bash简介及通配符、扩展通配符 shopt -s extglob

    http://www.rhce.cc/?p=1005 当我们执行一些命令的时候,很多的命令是由bash提供的.如果我们想知道某个命令是否是由bash内置的命令的话,我们可以使用type bash内置命 ...

  9. 细谈Linux和windows差异之图形化用户接口、命令行接口

    相信来看本博文的朋友,肯定是已经玩过linux好段时间了,才能深刻理解我此番话语. 这是在Windows下的命令行接口 这是windows下的用户接口 就是它,explorer.ext,可以去尝试.把 ...

  10. ANT打包J2EE项目war包

    1.下载并安装ant 2.安装ant步骤如下 .解压下载的zip包 .进入解压的目录,把bin目录放入系统变量PATH中. eg:E:\dev_tools\apache-ant-\bin .打开cmd ...