1 <div style="background-color:#fff;margin-bottom: 10px;">
2 <p style="margin:0 10px;height: 40px;line-height: 40px;
3 font-size: 16px;
4 color: #000;
5 border-bottom: 1px solid #f2f2f2;">
6 <span>{php echo count($usertuan);}</span>人在拼单,可直接参与
7 <span class="checkMore" style="float: right; color: #9c9c9c;">查看更多 </span>
8 </p>
9
10 <div class="list_lh" id=lan27_com_top style="height:40px;overflow: hidden;">
11 <div id=lan27_com_top1>
12 <ul id="marquees">
13 {loop $usertuan $item}
14 <li class="ctMsg" style="margin: 0 10px; overflow: hidden;
15 height: 40px;
16 display: flex;
17 border-bottom: 1px solid #f2f2f2;justify-content: space-between;">
18 <img src="{$item['avatar']}" alt=""
19 style="width:30px;height:30px;border-radius: 50%; margin: 5px -25px 0 0;">
20 <span style="line-height: 40px;font-size: 14px;
21 width: 74px;
22 overflow: hidden;">
23 {$item['realname']}
24 </span>
25 <div>
26 <p style=" color: #000;">
27 还差
28 <span style="color: red;margin: 0 -3px;">1人</span>
29 拼成
30 </p>
31 <p style="color: #000;margin-top: -2px;">
32 剩余
33 <span>11:25:2.0</span>
34 </p>
35 </div>
36 <a href="javascript:;" onclick="qubuy(this,{$item['user_id']})" style="width: 68px;
37 height: 28px;
38 background-color: red;
39 margin-top: 6px;
40 text-align: center;
41 line-height: 28px;
42 border-radius: 10px;
43 font-size: 14px;
44 color: white;">
45 去拼单
46 </a>
47 </li>
48 {/loop}
49 </ul>
50 </div>
51
52 <div id='lan27_com_top2'></div>
53 </div>
54 <!-- 参团滚动 -->
55 <div style="display: none;">
56 移动的高度<input id="height" ><br>
57 倒计时<input id="time" >秒<br>
58 </div>
59 </div>
1 <script type="text/javascript" src="js/jquery.js"></script>
2 <script type="text/javascript" src="js/scroll.js"></script>
3
4 //循环滚动不停
5 $(function(){
6 $("div .list_lh").myScroll({
7 speed:70, //数值越大，速度越慢
8 rowHeight:40 //li的高度
9 });
10 });
1 // 第二种
2 // 循环滚动停顿2秒 --（在服务器只能整体循环两次,不知道为毛）
3 var speed=35
4 var MarqueeHeight=0;//保存滚动的高度
5 var stoptime=0;//倒计时的时间
6 var jianshao=0;//一个标志，当为1时才开始倒计时
7 lan27_com_top2.innerHTML=lan27_com_top1.innerHTML //克隆lan27_com_top1为lan27_com_top2
8 function Marquee1(){
9 //当滚动至lan27_com_top1与lan27_com_top2交界时
10 if(lan27_com_top2.offsetTop-lan27_com_top.scrollTop<=0){
11 lan27_com_top.scrollTop-=lan27_com_top1.offsetHeight //lan27_com_top跳到最顶端
12 }
13 else{
14 lan27_com_top.scrollTop++;
15 }
16 MarqueeHeight++;//保存移动的高度
17 document.getElementById("height").value=MarqueeHeight//给高度文本框赋值
18 document.getElementById("time").value=stoptime/1000 //给倒计时文本框赋值
19
20 if(MarqueeHeight==40){//当滚动的高度达到50 也即是2行的时候停止滚动
21 clearInterval(MyMar1);
22 MarqueeHeight=0;
23 stoptime=2000;//倒计时2秒
24 jianshao=1;
25 document.getElementById("height").value=MarqueeHeight
26 document.getElementById("time").value=stoptime/1000
27 }
28 }
29
30 var MyMar1=setInterval(Marquee1,speed)//设置定时器
31 var MyMar2=setInterval(daojishi,100)
32 //鼠标移上时清除定时器达到滚动停止的目的
33 lan27_com_top.onmouseover=function() {clearInterval(MyMar1)}
34 //鼠标移开时重设定时器
35 lan27_com_top.onmouseout=function(){MyMar1=setInterval(Marquee1,speed)}
36 function daojishi(){
37 if(jianshao==1){
38 stoptime=stoptime-100;
39 if(stoptime<0){
40 stoptime=0
41 jianshao=0
42 MyMar1=setInterval(Marquee1,speed)
43 }
44 document.getElementById("height").value=MarqueeHeight
45 document.getElementById("time").value=stoptime/1000
46 }
47 }
