js實現文字從右滾動到左邊程式碼迴圈滾動例項
阿新 • • 發佈:2019-02-13
以下是程式碼例項:
<div style="background:#333;">
<div id="tgBigox">
<div id="tgGoox">
<a href="" target="_blank"></a>
</div>
</div>
</div>
<script type="text/javascript">
var cars = $("#tgGoox" ).width();
var i =0;
function start(){
i--;
if(i<=-cars){
i=2*cars;
document.getElementById('tgGoox').style.right =-cars+'px';
}else{
document.getElementById('tgGoox' ).style.left =i+'px';
}
setTimeout(start,10);
}
onload=function(){setTimeout(start,1000)};
</script>
css樣式:
#tgBigox{
position: relative;
width:900px; margin:0 auto; height:30px; line-height:30px; padding-right:65px; overflow:hidden;
}
#tgGoox{
position: absolute;
height:30px; line-height:30px;
top: 0px;
left:0;
}
#tgGoox a{
color:#fff;
margin-left:8px;
float:left;
}
#tgGoox a:hover{
color:#57bc54;
}