zoukankan      html  css  js  c++  java
  • js 滚动的文字(走马灯)

    // 滚动的文字
    function marqueeScroll() {
        //var $target = $(".marquee_outer:visible");
        if($(".marquee_outer").length == 0) {
            return false;
        }
        $(".marquee_outer").each(function() {
            var $target = $(this);
            if($target.hasClass("data-setInterval")) {
                return true; // 已经设置过滚动定时器
            }
            if($target.find("i").length == 0) {
                $target.wrapInner("<i></i>");
            }
            if($target.width() > $target.find("i").width()) {
                return true;
            }
            if($target.find(".marquee_inner2").length == 0) {
                $target.wrapInner('<span class="marquee_inner2" style="1000%"></span>');
                $target.find(".marquee_inner2").append($target.find("i").clone(true));
            }
            var marquee_1 = $target.find("i")[0];
            var marquee_2 = $target.find("i")[1];
            var marquee_outer = $target[0];
            setInterval(function() {
                if(marquee_outer.scrollLeft - marquee_2.offsetWidth >= 0) {
                    marquee_outer.scrollLeft -= marquee_1.offsetWidth;
                } else {
                    marquee_outer.scrollLeft++;
                }
            }, 30);
            $target.addClass("data-setInterval");
        });
    }
    // 调用
    <script>
    setInterval(marqueeScroll, 2000);  // 标题文字滚动
    </script>
    
    <div class="marquee"><em>知识点{{ forloop.counter }}:</em><span class="marquee_outer">{{ k.name }}</span></div>

    .

  • 相关阅读:
    H264 RTP封包原理(转载)
    FFmpeg的H264编码有内存泄漏吗??!!!
    最近在研究FFmpeg编解码
    罗一迦
    健康导报
    Vivado生成edf文件
    VIVADO生成MCS
    网络变压器
    Zynq 在Ubuntu上搭建编译环境
    [转]TimeQuest之delay_fall clock_fall傻傻分不清楚
  • 原文地址:https://www.cnblogs.com/weiok/p/5984078.html
Copyright © 2011-2022 走看看