DIY记录调用(新浪微博滚动版)For Discuz!X 1.5 【纯绿色版】

实际效果预览：
蚌医学生论坛
http://www.bbyxy.com/

效果截图：


1.  进入任意页面 比如论坛首页 点击DIY

2.  在需要的地方添加一个模块 空间类 > 记录模块
     里面的设置项就不赘述了 按你的需求设置下
     点击确定 样式那里也设置下 再确定

3.  鼠标移到你刚添加的模块那 弹出"编辑" 点击它 然后选择属性 > 模块模板
     把原来里面的代码替换成以下代码即可

1. <style type="text/css">
   
2. ul,li{list-style:none;}
   
3. .wplck{position:relative;height:195px;overflow:hidden;margin:0px auto; }
   
4. .sliderlck{position:absolute;width:98%;}
   
5. .fllck{float:left;}
   
6. .sliderlck img{display:block;padding:2px;border:1px solid #ccc;}
   
7. .sliderlck li{padding:5px 0;border-bottom:1px dashed #ccc;overflow:hidden;width:100%;}
   
8. .sliderlck p{font-size:12px;padding-left:46px;color:#666;line-height:18px;}
   
9. </style>
   
10. <script type="text/javascript">
    
11. function H$(i) {return document.getElementById(i)}
    
12. function H$$(c, p) {return p.getElementsByTagName(c)}
    
13. var sliderlck = function () {
    
14. function init (o) {
    
15. this.id = o.id;
    
16. this.at = o.auto ? o.auto : 3;
    
17. this.o = 0;
    
18. this.pos();
    
19. }
    
20. init.prototype = {
    
21. pos : function () {
    
22. clearInterval(this.__b);
    
23. this.o = 0;
    
24. var el = H$(this.id), li = H$$('li', el), l = li.length;
    
25. var _t = li[l-1].offsetHeight;
    
26. var cl = li[l-1].cloneNode(true);
    
27. cl.style.opacity = 0; cl.style.filter = 'alpha(opacity=0)';
    
28. el.insertBefore(cl, el.firstChild);
    
29. el.style.top = -_t + 'px';
    
30. this.anim();
    
31. },
    
32. anim : function () {
    
33. var _this = this;
    
34. this.__a = setInterval(function(){_this.animH()}, 20);
    
35. },
    
36. animH : function () {
    
37. var _t = parseInt(H$(this.id).style.top), _this = this;
    
38. if (_t >= -1) {
    
39. clearInterval(this.__a);
    
40. H$(this.id).style.top = 0;
    
41. var list = H$$('li',H$(this.id));
    
42. H$(this.id).removeChild(list[list.length-1]);
    
43. this.__c = setInterval(function(){_this.animO()}, 20);
    
44. //this.auto();
    
45. }else {
    
46. var __t = Math.abs(_t) - Math.ceil(Math.abs(_t)*.07);
    
47. H$(this.id).style.top = -__t + 'px';
    
48. }
    
49. },
    
50. animO : function () {
    
51. this.o += 2;
    
52. if (this.o == 100) {
    
53. clearInterval(this.__c);
    
54. H$$('li',H$(this.id))[0].style.opacity = 1;
    
55. H$$('li',H$(this.id))[0].style.filter = 'alpha(opacity=100)';
    
56. this.auto();
    
57. }else {
    
58. H$$('li',H$(this.id))[0].style.opacity = this.o/100;
    
59. H$$('li',H$(this.id))[0].style.filter = 'alpha(opacity='+this.o+')';
    
60. }
    
61. },
    
62. auto : function () {
    
63. var _this = this;
    
64. this.__b = setInterval(function(){_this.pos()}, this.at*1000);
    
65. }
    
66. }
    
67. return init;
    
68. }();
    
69. </script>
    
70. </head>
    
71. 
    
72. <div class="wplck">
    
73. <ul id="sliderlck" class="sliderlck">
    
74. [loop]
    
75. <li>
    
76. <a class="fllck" href="home.php?mod=space&uid={uid}" {target}><img src="{avatar}" width="33" height="33" alt="{username}" /></a>
    
77. <p><a href="home.php?mod=space&uid={uid}" title="{username}"{target}>{username}</a>：{title}</p>
    
78. <p><em class="xg1 xw0">{dateline}</em> <a style="color:#6EAFD5" href="{url}"{target}>[回复]</a></p>
    
79. </li>
    
80. [/loop]
    
81. </ul>
    
82. </div>
    
83. <script type="text/javascript">
    
84. new sliderlck({id:'sliderlck'})
    
85. </script>

复制代码

相关插件：
记录调用(上下无缝滚动版)For Discuz!X 1.5 【绿色】
https://discuz.dismall.com/thread-1978539-1-1.html

此楼可PASS，仿新浪微博的滚动请直接用主题帖里的代码即可








记录调用(上下无缝滚动版)For Discuz!X 1.5 【绿色】

1. <div class="module cl xld">
   
2. <div id=demo style="overflow:hidden; height:190px;">  
   
3. <!--dome 高度必须小于图片总高度 否则就不会显示滚动效果-->
   
4. <div id=demo1>
   
5. [loop]
   
6. <dl class="cl">
   
7.         <dd class="m"><a href="home.php?mod=space&uid={uid}" c="1"{target}><img src="{avatar}" width="48" height="48" alt="{username}" /></a></dd>
   
8.         <dt><a href="home.php?mod=space&uid={uid}" title="{username}"{target}>{username}</a> <em class="xg1 xw0">{dateline}</em></dt>
   
9.         <dd><a href="{url}"{target}>{title}</a></dd>
   
10. </dl>
    
11. [/loop]
    
12. 
    
13. <!--上下滚动 如果左右滚动 必须放在表格里布局才行-->
    
14. </div>
    
15. <div id=demo2></div>
    
16. </div>
    
17. <script language="javascript">
    
18. var speed=30            // 值越大速度越慢
    
19. demo2.innerHTML=demo1.innerHTML
    
20. function Marquee(){
    
21. 
    
22. 
    
23. if(demo2.offsetTop-demo.scrollTop<=0)
    
24. demo.scrollTop-=demo1.offsetHeight
    
25. else{
    
26. demo.scrollTop++
    
27. }
    
28. 
    
29. //上下左右无间隙滚动 最主要是 if 语句的代码修改
    
30. }
    
31. var MyMar=setInterval(Marquee,speed)
    
32. demo.onmouseover=function() {clearInterval(MyMar)}
    
33. demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
    
34. </script>
    
35. </div>

复制代码

貌似不错的样子

这个我早用了，不过和楼主的不一样而已

想问问 新浪微博 的 代码是那段呢


呵呵 是心情的  我还以为是 微博的 呢

回复 zhaoyan-30 的帖子

主题帖里的代码

楼主，虽然这个代码设计的很好。但你不做网站设计的，其实后面加上回复并不美观，而且字幕和头像一排并不合适。

看你这么乐于助人，我可以送你个专业级的页面

本来打算DX2放出来的，我喜欢低调。可以送你个时尚风格的首页

回复 wdqsok 的帖子

我的邮箱aitxt@126.com，非常感谢你哈