如何定位到div滚动条的最底端
function ScrollDiv() {
var ex = document.getElementById("calm");
ex.scrollTop = ex.scrollHeight;
}
obj.scrollTop:滚动条距离顶部的位置
obj.scrollHeight:流动区域的高度
<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滚动条的最底端的更多相关文章
- DIV设置滚动条在最底端
网站聊天样式,无论添加什么内容div的滚动条都显示在最底端 将div添加滚动条,给div一定的高度 <div id='up' style='height:100px; width:400px;o ...
- Selenium2+python自动化26-js处理内嵌div滚动条
前言 前面有篇专门用js解决了浏览器滚动条的问题,生活总是多姿多彩,有的滚动条就在页面上,这时候又得仰仗js大哥来解决啦. 一.内嵌滚动条 1.下面这张图就是内嵌div带有滚动条的样子,记住它的长相.
- FireFox火狐浏览器与IE兼容问题 - 透明滤镜 DIV滚动条
问题一:最简单的鼠标移过手变型的css要改了 cursor:pointer;/*FireFox(火狐)不支持cursor:hand*/ dw8下面自动出来的也没有hand这个属性了,标准的是point ...
- 2.24 js处理内嵌div滚动条
2.24 js处理内嵌div滚动条 前言 前面有篇专门用js解决了浏览器滚动条的问题,生活总是多姿多彩,有的滚动条就在页面上,这时候又得仰仗js大哥来解决啦.一.内嵌滚动条 1.下面这张图 ...
- Selenium2学习(十八)-- js处理内嵌div滚动条
前言 前面有篇专门用js解决了浏览器滚动条的问题,生活总是多姿多彩,有的滚动条就在页面上,这时候又得仰仗js大哥来解决啦. 一.内嵌滚动条 1.下面这张图就是内嵌div带有滚动条的样子,记住它的长相. ...
- Selenium2+python自动化26-js处理内嵌div滚动条【转载】
前言 前面有篇专门用js解决了浏览器滚动条的问题,生活总是多姿多彩,有的滚动条就在页面上,这时候又得仰仗js大哥来解决啦. 一.内嵌滚动条 1.下面这张图就是内嵌div带有滚动条的样子,记住它的长相.
- div滚动条演示
<!DOCTYPE html> <html> <head> <meta charset="gb2312" /> <title& ...
- css pre如果同时运用了css的border-radius、 overflow两个属性且标签中内容太多时,外部div滚动条在firefox下滚动时很卡
pre如果同时运用了css的border-radius. overflow两个属性且标签中内容太多时,外部div滚动条在firefox下滚动时很卡. 解决方法:去掉css中border-radius. ...
- 【前端】webkit内核浏览器DIV滚动条样式修改和设置
webkit内核浏览器DIV滚动条样式修改和设置 引言: 最近在做自己的小项目,为了设计出好看的页面费劲了心思,大到页面的整体布局,小到DIV的滚动条都不放过,以下是我通过查阅资料总结的webkit内 ...
随机推荐
- hdu 2639 Bone Collector II
Bone Collector II Time Limit: 5000/2000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others ...
- CSS和SVG中的剪切——clip-path属性和<clipPath>元素
剪切是什么 剪切是一个图形化操作,你可以部分或者完全隐藏一个元素.被剪切的元素可以是一个容器也可以是一个图像元素.元素的哪些部分显示或隐藏是由剪切的路径来决定的. 剪切路径定义了一个区域,在这个区域内 ...
- myeclipse2015不能启动tomcat,提示: Several ports (8005, 8080, 8009) required by Tomcat v7.0 Server at local
myeclipse2015不能启动tomcat,提示: Several ports (8005, 8080, 8009) required by Tomcat v7.0 Server at local ...
- 一个简单的appium脚本
这是一个简单的appium脚本,测试amazon购物过程的,过程包括搜索商品,然后从结果列表中选取中意的商品,然后加入购物车,等等. 它是一个最原始的脚本,对测试元素.数据.报告等未作任何的封装,后面 ...
- (二)NUnit单元测试心得
现在接着上次说到的内容,如何在项目中进行单元测试.由于做了一些调整,我上次发的内容,我这次也会重新发一次,请认真看看. 一.软件开发过程中存在的问题(没有使用单元测试的情况下) 难于定位bug的位置 ...
- [iOS基础控件 - 2] 按钮的基本使用
UIButton A.素材准备 1.图片素材放置到Images.xcassets中 B.按钮状态 1.normal:默认状态 Default 对应的枚举常量:UIControlStateNor ...
- [Objective-c 基础 - 2.5] .h和.m文件,点语法,成员变量作用域
A. 命令行编译和XCode编译 1.在存在多个.m源码实现文件的情况下,若根据需要引入.m文件,使用命令行仅仅编译主.m文件即可,但是XCode会同时编译全部.m文件,会发生编译错误(重复定义全局变 ...
- 7个改变世界的Java项目
Java的开源生态系统是强大而健康的,这是我们(Oreilly)创建OSCON Java(Open Source Convention Java)的主要原因之一.在过去10年中,一些项目已经被广泛接受 ...
- 3.x的触摸响应机制
第一种是采用函数回调,主要是用于MenuItem [cpp] view plaincopy // a selector callback void menuCloseCallback(Object* ...
- Oracle- 表的自增长创建
Oracle创建自增长要先写序列还要去写触发器,不像MSSQLSERVER那样方便.但也是麻烦,记录如下: Oracle中,可以为每张表的主键创建一个单独的序列,然后从这个序列中获取自动增加的标识符, ...