JavaScript滚动新闻类
电脑术语解释大全 http://www.xuehuiba.com
程序代码
<!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" />
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<title>滚动新闻类 - 51js.com - biyuan</title>
<style type="text/css">
body {
text-align:center;
}
td {
font-size:12px;
line-height:20px;
text-align:left;
}
.marquee {
width:100%;
height:100%;
overflow:hidden;
}
.m {
height:20px;
}
.m2 {
height:90px;
}
</style>
</head>
<body>
<table border='1'>
<tr>
<td height='20' width='250'><div id='marquee1' class='marquee m'></div></td>
<td height='20' width='300'><div id='marquee2' class='marquee m'></div></td>
</tr>
<tr>
<td height='99' colspan='2'>基本上够用了吧!</td>
</tr>
<tr>
<td height='90' colspan='2'><div id='marquee3' class='marquee m2'></div></td>
</tr>
</table>
<script language="JavaScript">
function BYMarquee(){
this.Content = []; //显示内容
this.Speed = 20; //上移速度
this.Object = {}; //http://www.knowsky.com marquee容器对象
this.Pause = true; //是否停留
this.Start = function(){
var o = this.Object;
var Pause = this.Pause;
var Stop = false;
var Stop2 = false;
o.onmouseover = function(){
Stop = Stop2 = true;
}
o.onmouseout = function(){
Stop = Stop2 = false;
}
var BodyHtml = [];
for(var i in this.Content){
BodyHtml.push("<a href="" + this.Content[i].link + "">" + this.Content[i].text + "</a>");
}
var Dv = document.createElement("div");
Dv.innerHTML = BodyHtml.join("<br />");
o.appendChild(Dv);
var DvHeight = Dv.offsetHeight;
while(Dv.offsetHeight /2 < o.offsetHeight){
Dv.innerHTML += "<br />" + Dv.innerHTML;
}
Dv.innerHTML += "<br />" + Dv.innerHTML;
setInterval(function(){
if(!Stop){
o.scrollTop ++;
if(o.scrollTop == o.scrollHeight - o.offsetHeight){
o.scrollTop = DvHeight - o.offsetHeight;
}