有一些做社区的站长，想要在首页更新新闻动态或者是活动信息，但是又没有现成的模板，j2直播，j2直播，怎么办？

　　机智的站长创客云写了一套仿淘宝滚动头条的代码，结合文章组件，显示动态的信息！

　　效果图：

　　首先，页面添加一个文章列表组件，

　　注意，文章列表样式要选这个：

　　文章显示条数不要选：不限

　　然后添加js组件，复制下面的代码到js 组件内。

　　代码如下（前方代码高能）：

　　<style>

　　.mod-pictxt4 p{display:none;}/*隐藏文章列表的时间元素*/

　　.mod-pictxt4 li{padding:8px 0px !important;}

　　.mod-pictxt4 {

　　height: 60px;/*高度*/

　　overflow:hidden;/*溢出部分隐藏*/

　　background-image: url(https://gw.alicdn.com/tps/i3/TB12wM3HXXXXXbxapXXdFmWHFXX-207-60.png?imgtag=avatar);/*背景图片地址*/

　　background-position: 1% 50%;/*背景图位置*/

　　background-size: 24%;/*背景图大小*/

　　background-repeat: no-repeat;/*背景图不重复*/

　　}

　　.mod-pictxt4 ul {

　　width:75%;/*文章列表的宽度*/

　　float: right;/*文章列表标题靠右*/

　　}

　　.mod-pictxt4 h3 {

　　color:#ff0000;/*文章列表标题字体颜色*/

　　font-size:14px;/*文章列表标题字体大小*/

　　}

　　</style>

　　<!--本代码可以用快站文章列表组件，用js控制滚动，文章列表必须在样式里选择最后一种无图样式-->

　　< src=""></>

　　< type="text/java">

　　$(function(){

　　var $this = $(".mod-pictxt4");

　　var scrollTimer;

　　$this.hover(function(){

　　clearInterval(scrollTimer);

　　},function(){

　　scrollTimer = setInterval(function(){

　　scrollNews( $this );

　　}, 2000 );

　　}).trigger("mouseout");

　　});

　　function scrollNews(obj){

　　var $self = obj.find("ul:first");

　　var lineHeight = $self.find("li:first").height();

　　$self.animate({ "margin-top" : -lineHeight +"px" },600 , function(){

　　$self.css({"margin-top":"0px"}).find("li:first").appendTo($self);

　　})

　　}

　　</>

　　淘宝头条的图片怎么修改？

　　在背景图片地址中替换你想要的图片，注意图片不要过大。

　　如有疑问可以加QQ群：129222538