js文字动态移动效果

<div style="width:300px;position:relative;top:9px;left:-300px;overflow:hidden">
<div  id="turnMore" style="color:red;cursor:pointer;font-size:15px;font-weight:bold;position:relative;top:0px;left:0px;"></div>
</div>

$("#turnMore").css(‘left‘, ‘0‘);
var tblLeft = 300;//最右边开始的位置 数字越大越靠右
var speedhq = 50; // 数值越大越慢
var outerWidth = $(‘#turnMore‘).outerWidth();//全部标题的宽度
function Marqueehq() {
if (tblLeft <= -outerWidth) {
tblLeft = 300;
} else {
tblLeft -= 1;
}
$(‘#turnMore‘).css(‘left‘, tblLeft + ‘px‘);
if (tblLeft == -outerWidth) {
clearInterval(MyMarhq);
setTimeout(function () {
MyMarhq = setInterval(Marqueehq, speedhq);
}, 1000*60*20);//移动完一遍后二十分钟后再执行
}
}

MyMarhq = setInterval(Marqueehq, speedhq);
// 鼠标移上去取消事件
$("#turnMore").hover(function () {
clearInterval(MyMarhq);
}, function () {
clearInterval(MyMarhq);
MyMarhq = setInterval(Marqueehq, speedhq);
})

js文字动态移动效果

上一篇:WEB前端&APP性能测试


下一篇:Android源码下载之----内核需要另外下载