為什么沒(méi)有效果。。求解?。?/h1>
<!DOCTYPE?html>
<html>
<head>
<meta?charset="utf-8">
????<title>文本間歇性滾動(dòng)</title>
</head>
<body>
<style?type="text/css">
#all{
????width:?400px;
????height:?215px;
????background:?#fff;
????border:5px?solid?rgb(171,171,171);
????border-radius:?10px;
????position:?relative;
}
#top{
????width:?400px;
????height:?60px;
????background:?rgb(218,73,90);
????position:?absolute;top:0;
????overflow:?hidden;?
}
#top?h1{
????font-size:?25px;
????color:?#fff;
????margin-left:?30px;
????margin-top:?15px;
}
#mainbody{
????overflow:?hidden;
????height:?300px;
}
#con1{
????width:?320px;
????list-style:?none;
}
#mainbody?li{
????height:?22px;
????line-height:?22px;
}
#mainbody?a:hover{color:?rgb(218,73,90);}
#mainbody?a{
????font-size:?12px;
????text-decoration:?none;
????color:?rgb(51,51,51);
}
#mainbody?span{
????font-size:?12px;
????float:?right;
????color:?rgb(153,153,153);
</style>
<script?type="text/javascript"?>
var?area=document.getElementById('mainbody');
var?liHeight=22;
var?speed=50;
area.innerHTML+=area.innerHTML;
area.scrollTop=0;
function?startScroll(){
????var?timer?=????setInterval('scrollUp()',speed);
????area.scrollTop++;
}
function?scrollUp(){
????if(area.scrollTop%liHeight==0){
????????????clearInterval(timer);
????????????setTimeout(startScroll,?2000);
????????}else{
????????????area.scrollTop++;
????????????if(area.scrollTop>=area.scrollHeight/2;){
????????????area.scrollTop=0;
????????}
????????}????
????????
}
setTimeout(startScroll,?2000);
area.onmouseover=function(){
????clearInterval(timer);
}
area.onmouseout=function(){
????timer?=????setInterval('scrollUp()',speed);
}
</script>
<div?id="all">
????<div?id="top"><h1>最新課程</h1></div>
????<div?id="mainbody">
????????<ul?id="con1">
????????????<li><a?href="#">1.學(xué)會(huì)html5?絕對(duì)的屌絲逆襲(案例)</a><span>2013-09-18</span></li>
????????????<li><a?href="#">2.tab頁(yè)面切換效果(案例)</a><span>2013-10-09</span></li>
????????????<li><a?href="#">3.圓角水晶按鈕制作(案例)</a><span>2013-10-21</span></li>
????????????<li><a?href="#">4.HTML+CSS基礎(chǔ)課程(系列)</a><span>2013-11-01</span></li>
????????????<li><a?href="#">5.分頁(yè)頁(yè)碼制作(案例)</a><span>2013-11-06</span></li>
????????????<li><a?href="#">6.導(dǎo)航條菜單的制作(案例)</a><span>2013-11-08</span></li>
????????????<li><a?href="#">7.信息列表制作(案例)</a><span>2013-11-15</span></li>
????????????<li><a?href="#">8.下拉菜單制作(案例)</a><span>2013-11-22</span></li>
????????????<li><a?href="#">9.如何實(shí)現(xiàn)“新手引導(dǎo)”效果</a><span>2013-12-06</span></li>
????????</ul>
????????<ul?id="con2"></ul>
????</div>
</div>
</body>
</html>
<!DOCTYPE?html> <html> <head> <meta?charset="utf-8"> ????<title>文本間歇性滾動(dòng)</title> </head> <body> <style?type="text/css"> #all{ ????width:?400px; ????height:?215px; ????background:?#fff; ????border:5px?solid?rgb(171,171,171); ????border-radius:?10px; ????position:?relative; } #top{ ????width:?400px; ????height:?60px; ????background:?rgb(218,73,90); ????position:?absolute;top:0; ????overflow:?hidden;? } #top?h1{ ????font-size:?25px; ????color:?#fff; ????margin-left:?30px; ????margin-top:?15px; } #mainbody{ ????overflow:?hidden; ????height:?300px; } #con1{ ????width:?320px; ????list-style:?none; } #mainbody?li{ ????height:?22px; ????line-height:?22px; } #mainbody?a:hover{color:?rgb(218,73,90);} #mainbody?a{ ????font-size:?12px; ????text-decoration:?none; ????color:?rgb(51,51,51); } #mainbody?span{ ????font-size:?12px; ????float:?right; ????color:?rgb(153,153,153); </style> <script?type="text/javascript"?> var?area=document.getElementById('mainbody'); var?liHeight=22; var?speed=50; area.innerHTML+=area.innerHTML; area.scrollTop=0; function?startScroll(){ ????var?timer?=????setInterval('scrollUp()',speed); ????area.scrollTop++; } function?scrollUp(){ ????if(area.scrollTop%liHeight==0){ ????????????clearInterval(timer); ????????????setTimeout(startScroll,?2000); ????????}else{ ????????????area.scrollTop++; ????????????if(area.scrollTop>=area.scrollHeight/2;){ ????????????area.scrollTop=0; ????????} ????????}???? ???????? } setTimeout(startScroll,?2000); area.onmouseover=function(){ ????clearInterval(timer); } area.onmouseout=function(){ ????timer?=????setInterval('scrollUp()',speed); } </script> <div?id="all"> ????<div?id="top"><h1>最新課程</h1></div> ????<div?id="mainbody"> ????????<ul?id="con1"> ????????????<li><a?href="#">1.學(xué)會(huì)html5?絕對(duì)的屌絲逆襲(案例)</a><span>2013-09-18</span></li> ????????????<li><a?href="#">2.tab頁(yè)面切換效果(案例)</a><span>2013-10-09</span></li> ????????????<li><a?href="#">3.圓角水晶按鈕制作(案例)</a><span>2013-10-21</span></li> ????????????<li><a?href="#">4.HTML+CSS基礎(chǔ)課程(系列)</a><span>2013-11-01</span></li> ????????????<li><a?href="#">5.分頁(yè)頁(yè)碼制作(案例)</a><span>2013-11-06</span></li> ????????????<li><a?href="#">6.導(dǎo)航條菜單的制作(案例)</a><span>2013-11-08</span></li> ????????????<li><a?href="#">7.信息列表制作(案例)</a><span>2013-11-15</span></li> ????????????<li><a?href="#">8.下拉菜單制作(案例)</a><span>2013-11-22</span></li> ????????????<li><a?href="#">9.如何實(shí)現(xiàn)“新手引導(dǎo)”效果</a><span>2013-12-06</span></li> ????????</ul> ????????<ul?id="con2"></ul> ????</div> </div> </body> </html>
2016-11-03
1.
#mainbody span{
? ?font-size: 12px;
? ?float: right;
? ?color: rgb(153,153,153);
后面缺回括號(hào)
2.
if(area.scrollTop>=area.scrollHeight/2;){
? ?area.scrollTop=0;
}
判斷條件多了個(gè)分號(hào)
area.innerHTML+=area.innerHTML;這個(gè)我的編譯器識(shí)別不了,我整體和老師不一樣。用了自己的方法。