文字 图片 无缝滚动

<script type="text/javascript" src="js/jquery-1.js"></script>
<style type="text/css">
*{margin:0px;padding:0px;border:0px;}
body{font-size:12px}
.coupons .right ul{
padding-left:20px;
padding-right:20px;
overflow:hidden;
}
#demo1{
height:auto;
text-align:left;
}
#demo2{
height:auto;
text-align:left;
}
#demo1  li{
list-style-type:none;
height:22px;
background:url() no-repeat left center;
text-align:left;
text-indent:15px;
}
#demo2  li{
list-style-type:none;
height:22px;
background:url() no-repeat left center;
text-align:left;
text-indent:15px;
}
</style>

<div class="coupon">
<div class="w1180">
    <div class="tit">
        <a class="fr" href="#">查看更多</a>
        <h2>优惠券</h2>
        </div>
        <div class="coupons">
        <div class="left">
            <div class="leftA">
                <h3><a href="#">免费发送优惠券至手机</a></h3>
                    <h2><a href="#">立即免费领取</a></h2>
                    <p style="padding-top:12px;">已有<span>1394</span>人领取</p>
                    <p>数量有限,先到先得</p>
                </div>
                <div class="leftB"></div>
            </div>
            <div class="right">
            <span class="shuzi">1394</span>
                <h2>业主已领取装修优惠劵</h2>
                

                
<div id="demo" style="overflow:hidden;height:200px;width:290px; margin-top:20px;">
<ul id="demo1">  
<li>·恭喜 qiao1985 用户<span>已领取</span>一张优惠券</li>
<li>·恭喜 qiao1985 用户<span>已领取</span>一张优惠券</li>
<li>·恭喜 qiao1985 用户<span>已领取</span>一张优惠券</li>
<li>·恭喜 qiao1985 用户<span>已领取</span>一张优惠券</li>
<li>·恭喜 qiao1985 用户<span>已领取</span>一张优惠券</li>
<li>·恭喜 qiao1985 用户<span>已领取</span>一张优惠券</li>
<li>·恭喜 qiao1985 用户<span>已领取</span>一张优惠券</li>
<li>·恭喜 qiao1985 用户<span>已领取</span>一张优惠券</li>
<li>·恭喜 qiao1985 用户<span>已领取</span>一张优惠券</li>
<li>·恭喜 qiao1985 用户<span>已领取</span>一张优惠券</li>
<li>·恭喜 qiao1985 用户<span>已领取</span>一张优惠券</li>
<li>·恭喜 qiao1985 用户<span>已领取</span>一张优惠券</li>
<li>·恭喜 qiao1985 用户<span>已领取</span>一张优惠券</li>
<li>·恭喜 qiao1985 用户<span>已领取</span>一张优惠券</li>
</ul> 
<div id="demo2"></div>
</div> 
<script type="text/javascript">
    var speed = 40
    var demo = document.getElementById("demo");
    var demo2 = document.getElementById("demo2");
    var demo1 = document.getElementById("demo1");
    demo2.innerHTML = "<ul>" + demo1.innerHTML + "</ul> ";
    function Marquee() {
        if (demo2.offsetTop - demo.scrollTop <= 0)
            demo.scrollTop -= demo1.offsetHeight
        else {
            demo.scrollTop++
        }
    }
    var MyMar = setInterval(Marquee, speed)
    demo.onmouseover = function () { clearInterval(MyMar) }
    demo.onmouseout = function () { MyMar = setInterval(Marquee, speed) } 
</script> 
<script type="text/javascript">
    $(document).ready(function () {
        $(".comInfo .anli .tab-menu ul li a").mouseover(function () {
            $(".comInfo .anli .tab-menu ul li a").removeClass("cur");
            $(this).addClass("cur");
        });
    });
    function tabmenua201502021114(tid) {
        $("#tabmenua-1").hide();
        $("#tabmenua-2").hide();
        $("#tabmenua-3").hide();
        $("#" + tid).show();
    }
</script>

            </div>
        </div>
    </div>
</div>

--------------------------------------------------------------------------------------------


posted @ 2022-03-23 08:47  离。  阅读(33)  评论(0编辑  收藏  举报