<!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>如何实现div内自动滚动?</title>
<style type="text/css">
#message{width:500px;height:235px;background-color:#feeff7;overflow:scroll;overflow-x:hidden;text-overflow:ellipsis;word-break:break-all;}
#message span{margin:6px;display:block;}
#message span a{color:#f60;text-decoration:underline;margin:0 4px;}
#message span a:hover{color:#f20;}
#message span label{color:#c70060;margin:0 4px;}
</style>
<script type="text/javascript">
function getEid(id){
return document.getElementById(id);
}
function newNode(param){
return document.createElement(param);
}
function newTextNode(param){
return document.createTextNode(param);
}function demo(){
var dest=getEid("message");
var newStr=newTextNode(new Date().toLocaleString()+":人生最大的财富是健康,最可怜的是嫉妒,最大的幸福是放得下,最大的敌人是自己!!!");
var span=newNode("span");
span.appendChild(newStr);
dest.appendChild(span);
message.scrollTop+=10000;
setTimeout("demo()",2000);
}window.onload=demo;
</script>
</head><body>
<div id="message"></div>
</body>
</html>

解决方案 »

  1.   

    message.scrollTop+=10000;楼上朋友的方法是用上了这句,就是用的scrollTop属性,有用,谢谢!改装了下,这样:
    message.scrollTop+=message.offsetHeight;也就是不用加上太多,加上本身的高度就行了!scrollxxx:滚动条的XX距离,可以是浏览器的,也可以是DIV的,看用在什么地方了   
    offsetxxx:可以用在页面上任何元素   
    clientxxx:也可以用在页面上任何元素   
    top和left的距离是相对于它的上一层来说的,width,height是指自身的宽度和高度