屏幕中公告滚动 新闻滚动 音乐滚动 html js写法(以公告滚动为例)

来源:互联网 发布:qq群推广淘宝客链接 编辑:程序博客网 时间:2024/06/02 05:28

历史公告
    <!--公告-->   <div class="live_corps_news clearfix right">       <div id="scroll_news">          <ul id="importData" class="live_corps_news_list clearfix">           <li style="font-size: 16px;color: #757575;">暂无公告</li>           <li style="font-size: 16px;color: #757575;">暂无公告</li>       </ul>       </div>        <div class="live_corps_news_ctrol">    </div>    <div class="live_corps_news_list_non" style="display: none;">       <span class="list_non_sp">历史公告</span>       <ul id="importDataAll" class="clearfix">              </ul>    </div></div>



    js执行

    <script>
    //公告滚动var scrollIndex = 0;var scrollTimer = null;var flag = true;function priceScroll_f() {    clearInterval(scrollTimer);    var ul = $("#importData");    var li = ul.children("li");    function run() {        if (scrollIndex >= li.length / 2) {            ul.css({top: 0});            scrollIndex = 1;            ul.stop().animate({top: -scrollIndex * 43}, 200);        }        else {            scrollIndex++;            ul.stop().animate({top: -scrollIndex * 43}, 200);        }    }    scrollTimer = setInterval(run, 3000);}$(document).on("mouseover", "#importData li", function () {    clearInterval(scrollTimer);});$(document).on("mouseout", "#importData li", function () {    priceScroll_f();});

    </script>
    1 0
    原创粉丝点击