jquery实现一个新闻文字缩放滚动列表效果代码
代码语言:html
所属分类:加载滚动
代码描述:jquery实现一个新闻文字缩放滚动列表效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="renderer" content="webkit">
<meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=no"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <!--兼容IE-->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<style>
a{color:#333;}
.news-scroll{width: 915px; height: 520px; margin:0 auto; border:2px solid #aaa; border-radius:30px;}
.news-scroll li{height: 93px; line-height:93px;}
.news-scroll li e{width: 190px; display: inline-block; text-align:center;}
.news-scroll li p{display: inline-block;}
/*消息滚动*/
.ellipsis {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
display: block;
}
.roll {
position: relative;
}
.roll li {
width: 100%;
position: absolute;
left: 0;
-webkit-transition: all 3s;
-moz-transition: all 3s;
-ms-transition: all 3s;
-o-transition: all 3s;
transition: all 2s;
font-size: 18px;
list-style: none;
}
.roll li.roll_1 {
opacity: 0.5;
top: 0;
font-size.........完整代码请登录后点击上方下载按钮下载查看
网友评论0