<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

    <script src="js/jquery-2.1.4.min.js"></script>

    <style>

        #scrollDiv

        {

            width: 100%;

            margin:100px auto;

            height: 300px;

            line-height: 25px;

            border: #ccc 1px solid;

            overflow: hidden;

        }

        #mytable{

            width: 80%;

            /*height: 300px;*/

            line-height: 25px;

            border: #ccc 1px solid;

            overflow: hidden;

        }

        #mytable tbody tr{

            height: 25px;

        }

        #scrollDiv li

        {

            height: 25px;

            padding-left: 10px;

        }

    </style>

</head>

<body>

    <div id="scrollDiv">

        <table width="100%" id="mytable" style="margin: 0px;">

            <tbody id="mytbody">

                <tr>

                    <td  align="center">17071700002</td>

                    <td  align="center">危险化学品经营许可</td>

                    <td  align="center">安监局</td>

                    <td  align="center">2017-07-17</td>

                    <td  align="center">

                            办理中

                    </td>

                </tr>

                 <tr>

                    <td align="center">17071700002</td>

                    <td align="center">危险化学品经营许可</td>

                    <td align="center">安监局</td>

                    <td align="center">2017-08-17</td>

                    <td align="center">

                            办理中

                    </td>

                </tr>

                 <tr>

                    <td align="center">17071700002</td>

                    <td align="center">危险化学品经营许可</td>

                    <td align="center">安监局</td>

                    <td align="center">2017-09-17</td>

                    <td align="center">

                            办理中

                    </td>

                </tr>

                 <tr>

                    <td align="center">17071700002</td>

                    <td align="center">危险化学品经营许可</td>

                    <td align="center">安监局</td>

                    <td align="center">2017-10-17</td>

                    <td align="center">

                            办理中

                    </td>

                </tr>

                 <tr>

                    <td align="center">17071700002</td>

                    <td align="center">危险化学品经营许可</td>

                    <td align="center">安监局</td>

                    <td align="center">2017-11-17</td>

                    <td align="center">

                            办理中

                    </td>

                </tr>

                 <tr>

                    <td align="center">17071700002</td>

                    <td align="center">危险化学品经营许可</td>

                    <td align="center">安监局</td>

                    <td align="center">2017-12-17</td>

                    <td align="center">

                            办理中

                    </td>

                </tr>

                 <tr>

                    <td align="center">17071700002</td>

                    <td align="center">危险化学品经营许可</td>

                    <td align="center">安监局</td>

                    <td align="center">2017-13-17</td>

                    <td align="center">

                            办理中

                    </td>

                </tr>

                <tr>

                    <td align="center">17071700002</td>

                    <td align="center">危险化学品经营许可</td>

                    <td align="center">安监局</td>

                    <td align="center">2017-14-17</td>

                    <td align="center">

                            办理中

                    </td>

                </tr>

                 <tr>

                    <td align="center">17071700002</td>

                    <td align="center">危险化学品经营许可</td>

                    <td align="center">安监局</td>

                    <td align="center">2017-15-17</td>

                    <td align="center">

                            办理中

                    </td>

                </tr>

                <tr>

                    <td align="center">17071700002</td>

                    <td align="center">危险化学品经营许可</td>

                    <td align="center">安监局</td>

                    <td align="center">2017-16-17</td>

                    <td align="center">

                            办理中

                    </td>

                </tr>

                 <tr>

                    <td align="center">17071700002</td>

                    <td align="center">危险化学品经营许可</td>

                    <td align="center">安监局</td>

                    <td align="center">2017-17-17</td>

                    <td align="center">

                            办理中

                    </td>

                </tr>

                <tr>

                    <td align="center">17071700002</td>

                    <td align="center">危险化学品经营许可</td>

                    <td align="center">安监局</td>

                    <td align="center">2017-18-17</td>

                    <td align="center">

                            办理中

                    </td>

                </tr>

                 <tr>

                    <td align="center">17071700002</td>

                    <td align="center">危险化学品经营许可</td>

                    <td align="center">安监局</td>

                    <td align="center">2017-19-17</td>

                    <td align="center">

                            办理中

                    </td>

                </tr>

            </tbody>

        </table>

    </div>

<script>

     function clock(){

        $("#mytable").animate({marginTop:"-25px"},500,function(){

            $(this).css({marginTop:"0px"}).find("tr:first").appendTo(this);

        })

    }

    $(function(){

        var myvar=setInterval("clock()",1000);

        $("#scrollDiv").hover(function(){

           console.log("aaa");

            clearInterval(myvar);

        },function(){

            myvar = setInterval("clock()",1000);

            })

    })

</script>

</body>

</html>

jquery实现文字自动向上滚动,鼠标放上去停止,移开继续滚动代码...的更多相关文章

  1. JS实现鼠标移上去图片停止滚动移开恢复滚动效果

    这是在做个人站的时候展示项目成果,因为不光需要展示,还需要介绍详细内容,就在滚动展示的地方做了这个效果以便于点开想要看的项目. 首先,要做的是一个需要滚动的区域.我前边写过一个关于图片循环滚动的示例, ...

  2. javascript实现图片切换、自动走、鼠标移入会停止，移出继续走

    要实现以上效果并不难,把功能分开一步一步来实现就变得简单了,录制动态图不流畅,看代码意会吧! <!doctype html> <html lang="en"> ...

  3. JavaScript、tabel切换完整版—自动切换—鼠标移入停止-移开运行

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. Jquery实现文字向上逐条滚动

    直接上代码: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" ...

  5. marquee 标签的鼠标放上去滚动效果 鼠标离开继续滚动

    效果很实用,可以轻松的实现鼠标放上去停止滚动.鼠标离开继续滚动的效果.下面是具体的用法(特别注意onMouseOver和onMouseOut是需要同时写进去才会出现比较好的效果):onMouseOut ...

  6. jquery插件之文字间歇自动向上滚动

    该插件乃本博客作者所写,目的在于提升作者的js能力,也给一些js菜鸟在使用插件时提供一些便利,老鸟就悠然地飞过吧. 此插件旨在实现目前较为流行的文字间歇向上滚动特效,当鼠标移动到文字上时,向上滚动会停 ...

  7. jQuery实现的文字逐行向上间歇滚动效果示例

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  8. js鼠标经过文字滚动，移开还原

    不说别的,直接贴代码. <div class="kj-scroll" id="countrylist0" onmouseover="wPAa = ...

  9. 利用自定义动画 animate() 方法，实现某图书网站中“近 7 日畅销榜”中的图书无缝垂直向上滚动特效:当光标移入到图书上时，停止滚动，鼠标移开时，继续滚动

    查看本章节 查看作业目录 需求说明: 利用自定义动画 animate() 方法,实现某图书网站中"近 7 日畅销榜"中的图书无缝垂直向上滚动特效:当光标移入到图书上时,停止滚动,鼠 ...

随机推荐

  1. Linux下汇编语言学习笔记64 ---

    这是17年暑假学习Linux汇编语言的笔记记录,参考书目为清华大学出版社 Jeff Duntemann著 梁晓辉译<汇编语言基于Linux环境>的书,喜欢看原版书的同学可以看<Ass ...

  2. 一步步搭建java信息管理系统00 - 前言

    开发前,先上效果图吧 信息管理系统,个人认为,以下几个因素是不可缺少的 多tab 因菜单比较多,右侧的树形一定要考虑,如果菜单还是多,那么顶部就要考虑起来了 以后想到什么,再添加吧. 看到easyui ...

  3. POJ 1384 POJ 1384 Piggy-Bank(全然背包)

    链接:http://poj.org/problem?id=1384 Piggy-Bank Time Limit: 1000MS Memory Limit: 10000K Total Submissio ...

  4. 007 Vlan config

    sw0(config)#vlan 2 sw0(config-vlan)#name Sales sw0(config-vlan)#vlan 3 sw0(config-vlan)#name Tech sw ...

  5. 基于Office 365 无代码工作流分析-数据源的建立！

     标准操作步骤 下面整个步骤我们是以嘉昊信息的招聘过程的整个流程为一个场景,整个的流程场景的步骤例如以下: 整个的过程,我们通过Infopath 进行对应的表单流转,然后利用Sharepoint ...

  6. div拖拽缩放jquery插件编写——带8个控制点

    项目中需要对div进行拖拽缩放,需要有控制面板8个控制点的那种,原以为这么常见的效果应该能搜索到很多相关插件,然而可以完成拖拽的实繁,却找不到我想要的,还是自己动手丰衣足食吧 效果预览(只支持pc端) ...

  7. Java 编码 UTF-8

    近期在处理文件时发现了相同类型的文件使用的编码可能是不同的.所以想将文件的格式统一一下(由于UTF-8的通用性,决定往UTF-8统一),遇见的第一个问题是:怎样查看现有文件的编码方式. 文件编码问题集 ...

  8. [计算机-好软推荐]证件照制作的利器,不会PS也没有关系

    多年前发现了这一款软件,后来不管电脑是从xp升级到win7,还是从win7升级到win8,我都收藏了它. 我用它主要是制作大头照,然后通过咔嚓鱼冲印,比起一般的冲印店要便宜些. 这个软件是台湾的朋友开 ...

  9. 在js中取选中的radio值

    在js中取选中的radio值 <input type="radio" name="address" value="0" /> & ...

  10. Oracle 11g密码过期问题及解决方案

    问题: 在自用的一个系统里,连接的是本地自建的一个数据库.用sqldeveloper登录数据库.提示如下图: 提示:密码过期 解决方案: 密码过期一般存在两种可能: 由于Oracle中默认在defau ...