这是Discuz X2 DIY模块做的微博滚动显示代码,效果很华丽。见上图。
方法:
一、新建一个【空间类 – > 记录模块】
二、打开模块属性里面的模块模版。
三、把下面代码复制进去保存就OK了。
- <style type=“text/css”>
- ul,li{list-style:none;}
- .wplck{position:relative;height:180px;overflow:hidden;margin:0pxauto;}
- .sliderlck{position:absolute;width:98%;}
- .fllck{float:left;}
- .sliderlckimg{display:block;padding:2px;border:1pxsolid#ccc;}
- .sliderlckli{padding:5px0;border-bottom:1pxdashed#ccc;overflow:hidden;width:100%;}
- .sliderlckp{font-size:12px;padding-left:46px;color:#666;line-height:18px;}
- </style>
- <scripttype=“text/javascript”>
- functionH$(i){returndocument.getElementById(i)}
- functionH$$(c,p){returnp.getElementsByTagName(c)}
- varsliderlck=function(){
- functioninit(o){
- this.id=o.id;
- this.at=o.auto?o.auto:3;
- this.o=0;
- this.pos();
- }
- init.prototype={
- pos:function(){
- clearInterval(this.__b);
- this.o=0;
- varel=H$(this.id),li=H$$(“li”,el),l=li.length;
- var_t=li[l-1].offsetHeight;
- varcl=li[l-1].cloneNode(true);
- cl.style.opacity=0;cl.style.filter=“alpha(opacity=0)”;
- el.insertBefore(cl,el.firstChild);
- el.style.top=-_t+”px”;
- this.anim();
- },
- anim:function(){
- var_this=this;
- this.__a=setInterval(function(){_this.animH()},20);
- },
- animH:function(){
- var_t=parseInt(H$(this.id).style.top),_this=this;
- if(_t>=-1){
- clearInterval(this.__a);
- H$(this.id).style.top=0;
- varlist=H$$(“li”,H$(this.id));
- H$(this.id).removeChild(list[list.length-1]);
- this.__c=setInterval(function(){_this.animO()},20);
- //this.auto();
- }else{
- var__t=Math.abs(_t)-Math.ceil(Math.abs(_t)*.07);
- H$(this.id).style.top=-__t+”px”;
- }
- },
- animO:function(){
- this.o+=2;
- if(this.o==100){
- clearInterval(this.__c);
- H$$(“li”,H$(this.id))[0].style.opacity=1;
- H$$(“li”,H$(this.id))[0].style.filter=“alpha(opacity=100)”;
- this.auto();
- }else{
- H$$(“li”,H$(this.id))[0].style.opacity=this.o/100;
- H$$(“li”,H$(this.id))[0].style.filter=“alpha(opacity=”+this.o+”)”;
- }
- },
- auto:function(){
- var_this=this;
- this.__b=setInterval(function(){_this.pos()},this.at*1000);
- }
- }
- returninit;
- }();
- </script>
- <divclass=“wplck”>
- <ul id=“sliderlck” class=“sliderlck” style=“top:0pt;”>[loop]
- <li>
- <a target=“_blank” href=“home.php?mod=space&uid={uid}” class=“fllck”><img width=“33” height=“33” alt=”{username}” src=“{avatar}”></a>
- <p><a target=“_blank” title=“{username}” href=“home.php?mod=space&uid={uid}”>{username}</a>:{title}</p>
- <p><em class=“xg1xw0”>{dateline}</em><a target=“_blank” href=“{url}” style=“color:rgb(110,175,213);”>[回复]</a></p>
- </li>
- [/loop]</ul>
- </div>
- <script type=“text/javascript”>
- newsliderlck({id:”sliderlck”})
- </script>