HTML代码块: user-gold-cdn.xitu.io/2018/11/22/…
css 代码块:
* {
margin:0;
padding:0;
}
li {
list-style:none;
}
.news {
height:35px;
background:#fff;
overflow:hidden;
}
.news .t_news {
height:20px;
color:#2a2a2a;
margin-top:15px;
overflow:hidden;
position:relative;
width:500px;
}
.news .news_li,.swap {
line-height:20px;
display:inline-block;
position:absolute;
top:0;
right:0;
font-size:14px;
text-align:right;
color:#585858
}
.news .swap {
top:20px;
}
**js代码块:
$('.swap').html($('.news_li').html());
x = $('.news_li');
y = $('.swap');
h = $('.news_li li').length * 20; //20为每个li的高度
var hh = $('.news_li li').length;
if (hh > 1)
//setTimeout(b,3000);//滚动间隔时间 现在是3秒
b();
b();
function b() {
t = parseInt(x.css('top'));
//alert(t)
y.css('top', '20px');
x.animate({
top: t - 20 + 'px'
}, 'slow'); //20为每个li的高度
if (Math.abs(t) == h - 20) { //20为每个li的高度
y.animate({
top: '0px'
}, 'slow');
z = x;
x = y;
y = z;
}
setTimeout(b, 3000); //滚动间隔时间 现在是3秒
}
先复制试一下是不是你想要的效果 希望能帮到你们哈!!!
复制代码