<html>?<head>??<title>文字的無(wú)縫滾動(dòng)</title>??<meta?charset="utf-8">??<meta?http-equiv="X-UA-Compatible"?content="IE=edge,chrome=1"?/>???<style?type="text/css">???*{?????margin:?0;????padding:?0;???}???body{????font-size:?12px;????line-height:?24px;???}???a{????text-decoration:?none;????color:#333;???}???a:hover{????color:#ff0000;???}???ul?{????????list-style:?outside?none?none;???}???#mooc{????width:?399px;????margin:?50?auto?0;????border:?5px?solid?#BBBBBB;????box-shadow:?2px?2px?10px?#ababab;????border-radius:?15px;???}???#mooc_head{????height:?60px;?/*?Safari?5.1?-?6.0?*/???????????background:?-webkit-linear-gradient(top,?#f05e6f,?#c9394a);???????????background:?-moz-linear-gradient(center?top,#f05e6f,?#c9394a);???????????background:?linear-gradient(to?bottom,?#f05e6f,?#c9394a);?/*?Safari??/*?Firefox?3.6?-?15??/*?標(biāo)準(zhǔn)的語(yǔ)法?*/???????????position:?relative;???????????padding-left:?30px;???????????line-height:?60px;????font-size:?24px;????color:#FFFFFF;????border-radius:?8px?8px?0px?0px;???}???#mooc_head?a{????right:10px;????bottom:?10px;????line-height:?30px;????color:white;????position:?absolute;????font-size:?12px;???}???#moocbox{????height:150px;????overflow:?hidden;????margin-left:?25px;????width:335px;???}???#moocbox?ul?li{????height:?24px;????}???#moocbox?ul?li?a{????display:block;????color:black;????float:left;????height:?24px;????text-indent:?15px;????overflow:?hidden;????width:?180px;???}???#mooc?span{????color:#999;????float:?right;???}??</style>?</head>?<body>??<div?id="mooc">???<h3?id="mooc_head">慕課網(wǎng)最新課程???<a?href="#">更多>></a>???</h3>???<div?id="moocbox">????<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">????????<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>???</div>??</div>???<script?type="text/javascript">??var?l1?=?document.getElementById("moocbox");??var?con1=document.getElementById("con1");??function?scrollUp?()?{???if(l1.scrollTop>=con1.offsetHeight){????l1.scrollTop=0;???}else{????l1.scrollTop++;???}??}??var?time=50;??var?myScroll=setInterval(scrollUp,time);??l1.onmouseover=function(){???clearInterval(myScroll);??}??l1.onmouseout=function(){???myScroll=setInterval(scrollUp,time);???}??</script>?</body></html>
問(wèn)為什么我的a:hover沒(méi)有執(zhí)行??跟那塊沖突了???
2016-04-03
建議嘗試 用js寫(xiě)試試?
2016-08-23
是你代碼黏貼得太六,我黏貼這樣的代碼給你看,你看嘛
2016-06-17
以上兩種方法都可以實(shí)現(xiàn)你要的效果