日期:2014-05-16 浏览次数:20578 次
我也是最近因为要做这种效果所以找了一下,很多都没有用,有的滚动一半就不滚了!以下是有用的所以收藏了,大家也可以参考一下。
直接贴代码了:
上下滚动
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<HTML xmlns="http://www.w3.org/1999/xhtml">
<head>
<TITLE>文字上下滚动</TITLE>
<META http-equiv=Content-Type content="text/html;charset=utf-8">
<STYLE type=text/css media=screen>
*{margin:0;padding:0;font-size:12px;}
a{color:#333;text-decoration:none}
a:hover{color:#901d22;text-decoration:underline}
.clear{clear:both;font-size:0;line-height:0;height:0}
SPAN.darkred{font-size:14px;color:#933}
#search{border:1px solid #ccc;margin:0 auto;width:950px;margin-bottom:8px;height:29px}
#commend{width:720px;color:#fff}
#commend a{color:#333}
.scrollNews{padding-TOP:4px;position:relative}
#newscommend{padding-RIGHT:2px;font-weight:normal;overflow:hidden;width:602px;line-height:20px;height:20px}
.scrollNews div{LEFT:507px;position:absolute;}
.scrollNews a{CURSOR:pointer}
.scrollNews IMG{width:25px;height:8px;background:#000;}
</STYLE>
</head>
<body>
<div id="new_list" style="display:none;">
<h6><a href="#">宋山木的“温柔adf论”能成立吗?</a></h6>
<h6><a href="#">坐在中国最拥挤的火车上</a></h6>
<h6><a href="#">前卫美女拍比基尼婚纱照</a></h6>
<h6><a href="#">中南海保镖这么练出来的</a></h6>
<h6><a href="#">围观景区冬日人体彩绘秀</a></h6>
<h6><a href="#">贷款修路有尽 为何缴费还贷不止?</a></h6>
<h6><a href="#">中国“元”级柴电潜艇堪称深海歼20</a></h6>
<h6><a href="#">辛酸中的感动:为那些骑摩返们</a></h6>
<h6><a href="#">高房价 让多少未婚女孩当了小三?</a></h6>
<h6><a href="#">内衣模特大赛照!真有料</a></h6>
</div>
<div id=search>
<div id=commend>
<div class=scrollNews>
<H3 id=newscommend></H3>
<div style="TOP:3px"><a id="pre"><IMG src=""></a></div>
<div style="TOP:15px"><a id="next"><IMG src=""></a></div>
</div>
</div>
</div>
<SCRIPT type="text/javascript">
function scrollnews(){
var htext=document.getElementById("new_list").getElementsByTagName("h6");
var text_holder=document.getElementById("newscommend");
var oFrag=document.createDocumentFragment();
oFrag.innerHTML="";
for(var i=0;i<htext.length;i++){
oFrag.innerHTML+=htext[i].innerHTML+" ";
if((i>0&&i%2==1)||(i==htext.length-1&&i%2==0)){
oFrag.innerHTML+="<br/>";
}
}
text_holder.innerHTML=oFrag.innerHTML;
}
function ScrollText(content,btnPrevious,btnNext,autoStart,timeout,isSmoothScroll){
this.Speed=10;
this.Timeout=timeout;
this.stopscroll=false;
this.isSmoothScroll=isSmoothScroll;
this.LineHeight=20;
thisthis.NextButton=this.$(btnNext);
thisthis.PreviousButton=this.$(btnPrevious);
thisthis.ScrollContent=this.$(content);
this.ScrollContent.innerHTML+=this.ScrollContent.innerHTML;
if(this.PreviousButton){
thisthis.PreviousButton.onclick=this.GetFunction(this,"Previous");
thisthis.PreviousButton.onmouseover=this.GetFunction(this,"MouseOver");
thisthis.PreviousButton.onmouseout=this.GetFunction(this,"MouseOut");
}
if(this.NextButton){
thisthis.NextButton.onclick=this.GetFunction(this,"Next");
thisth