zoukankan      html  css  js  c++  java
  • html 加js 滚动animate

     function TimeControl(){
            $(".message_scroll_box").animate({marginTop:96},800,
                    function(){
                        $(".message_scroll_box").css({marginTop:0});    //把顶部的边界清零
                        $(".message_scroll_box .message_scroll:first").before($(".message_scroll_box .message_scroll:last"));    //在第一个新闻后面插入最后一个新闻
    
                    });
        }
        var T=setInterval(TimeControl,2300);    //开始定时
        $(".message_scroll_box").mouseenter(function(){
            clearInterval(T);    //停止定时
        })
                .mouseleave(function(){
                    T=setInterval(TimeControl,2500);    //再次定时
                })


     <div class="dataAllBorder01 cage_cl" style="margin-top: 1.5% !important; height: 32%; position: relative;">
                        <div class="dataAllBorder02" style="padding: 1.2%; overflow: hidden">
    
                            <div class="message_scroll_box">
                                <div class="message_scroll">
                                <div class="scroll_top">
                                    <span class="scroll_title">数据流量警示</span>
                                    <span class="scroll_level scroll_level01">一级</span>
                                    <a class="localize"></a>
                                    <span class="scroll_timer">17-09-13/9:52</span>
                                </div>
                                <div class="msg_cage">
                                    <a class="localize_title">下载大量视频</a>
                                </div>
                                <div class="msg_cage">
                                    <a class="localize_msg">xxx视频网站</a>
                                </div>
                               </div>
                                <div class="message_scroll">
                                    <div class="scroll_top">
                                        <span class="scroll_title">数据流量警示</span>
                                        <span class="scroll_level scroll_level03">三级</span>
                                        <a class="localize"></a>
                                        <span class="scroll_timer">17-09-13/9:52</span>
                                    </div>
                                    <div class="msg_cage">
                                        <a class="localize_title">下载大量视频</a>
                                    </div>
                                    <div class="msg_cage">
                                        <a class="localize_msg">xxx视频网站</a>
                                    </div>
                                </div>
                                <div class="message_scroll">
                                    <div class="scroll_top">
                                        <span class="scroll_title">数据流量警示</span>
                                        <span class="scroll_level scroll_level02">二级</span>
                                        <a class="localize"></a>
                                        <span class="scroll_timer">17-09-13/9:52</span>
                                    </div>
                                    <div class="msg_cage">
                                        <a class="localize_title">下载大量视频</a>
                                    </div>
                                    <div class="msg_cage">
                                        <a class="localize_msg">xxx视频网站</a>
                                    </div>
                                </div>
                                <div class="message_scroll">
                                    <div class="scroll_top">
                                        <span class="scroll_title">数据流量警示</span>
                                        <span class="scroll_level scroll_level01">一级</span>
                                        <a class="localize"></a>
                                        <span class="scroll_timer">17-09-13/9:52</span>
                                    </div>
                                    <div class="msg_cage">
                                        <a class="localize_title">下载大量视频</a>
                                    </div>
                                    <div class="msg_cage">
                                        <a class="localize_msg">xxx视频网站</a>
                                    </div>
                                </div>
                            </div>
    
                        </div>
                        <div class="scroll_tool_outbox">
                            <div class="scroll_tool_box">
                                <a class="scroll_tool" href="#">查看历史推送</a>
                            </div>
                        </div>
                    </div>
               
  • 相关阅读:
    阿里巴巴Java开发规约扫描插件-Alibaba Java Coding Guidelines 在idea上安装使用教程
    [Rust] 数据类型的转换
    [golang] 错误处理
    [golang] 变量声明和初始化 var, :=, new() 和 make()
    [golang] 概念: struct vs interface
    [Rust] 变量的属性: 不可变(immutable), 可变(mutable), 重定义(shadowing), 常量(const), 静态(static)
    [Rust] 命名习惯
    [Rust] Workspace,Package, Crate 和 Module
    如何将 IPhone 的文件导入 Linux
    软引用和弱引用
  • 原文地址:https://www.cnblogs.com/zuochanzi/p/13652855.html
Copyright © 2011-2022 走看看