<!DOCTYPE html>

 <html>

     <head>

         <meta charset="UTF-8">

         <title>滚动公告</title>

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

         <style>

             *{

                 padding: 0;

                 margin: 0;

             }

             body{

                 margin: 50px;

             }

             ul,li{

                 list-style: none;

             }

             li{

                 height: 30px;

                 line-height: 30px;

             }

         </style>

     </head>

     <body>

         <ul>

             <li>我是第1条公告............................</li>

             <li>我是第2条公告............................</li>

             <li>我是第3条公告............................</li>

             <li>我是第4条公告............................</li>

             <li>我是第5条公告............................</li>

             <li>我是第6条公告............................</li>

             <li>我是第7条公告............................</li>

             <li>我是第8条公告............................</li>

             <li>我是第9条公告............................</li>

         </ul>

         <script>

             $(function(){

                 setInterval(function(){

                     var newLi = $('ul>:first').clone(true);

                     $('ul').append(newLi);

                     $('ul>:first').remove();

                 },2000);

             })

         </script>

     </body>

 </html>

效果：

滚动公告--jq的更多相关文章

  1. Taro -- 文字左右滚动公告效果

    文字左右滚动公告效果 设置公告的左移距离,不断减小,当左移距离大于公告长度(即公告已移出屏幕),重新循环. <View className='scroll-wrap'> <View ...

  2. vue 滚动公告

    <!-- 滚动公告 --> <div class="textArr"> <p class="slice-enter-active" ...

  3. HTML-滚动字幕的源代码（可作滚动公告）

    1.字体颜色可变幻的滚动字幕源代码: <DIV style="FILTER: glow(color=#000000 ,strength=1); COLOR: #000000; HEIG ...

  4. [JS]手动实现一个横屏滚动公告js插件

    前言 工作中要用到.在github上找的大部分都是竖屏滚动没办法只能自己手动写. 本来只是想随便实现一下的,结果一时兴起把它弄成了一个简单的小插件,开了个github仓库(希望路过点个星) JS横屏滚 ...

  5. 【H5】滚动事件(jq)

    $(function(){ console.log($('html,body').scrollTop());  //记录滚动高度(滚动前) }) $('html,body').scroll(funct ...

  6. 微信小程序 - 滚动公告组件

    支持横轴.纵轴滚动. 点击下载:speaker

  7. 纯css滚动公告栏目

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  8. cocos 向左滚动公告

      properties:{ lblNotice:[cc.Node], speed:1, curtext:null }, start (){ this.getNotice(); }, getNotic ...

  9. H5实现摇一摇技术总结

    摇一摇遇到的问题 一.如何对摇晃效果进行反馈 刚开始的处理方式是,摇晃过程中不做任何处理,但后来反馈说这种效果不好,好像就没有摇动一样,如果声音也不响的话,就真的和什么都没发生一样. 后来想了想,加入 ...

随机推荐

  1. [转载]EF或LINQ 查询时使用IN并且根据列表自定义排序方法

    原文地址:EF或LINQ 查询时使用IN并且根据列表自定义排序方法作者:李明川 EF和LINQ改变了原有的手写SQL时期的一些编码方法,并且增强了各数据库之间的移植性简化了开发时的代码量和难度,由于很 ...

  2. 前端生成pdf

    https://stackoverflow.com/questions/31610129/pdfmake-html-table-to-pdfmake-table https://www.jianshu ...

  3. rsa加密算法及js的JSEncrypt实现前端加密

    最近的项目中用到了rsa加密算法,在实现了相关功能之后,我去了解了一下rsa相关原理,于是就写了这篇博客啦. 首先介绍一下什么是rsa加密算法: 作为非对称加密算法的老大,rsa号称是地球上最安全的加 ...

  4. jquery取出checkbox多选的值(带全选功能)

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  5. Spring+Quartz集群环境下定时调度的解决方案

    集群环境可能出现的问题 在上一篇博客我们介绍了如何在自己的项目中从无到有的添加了Quartz定时调度引擎,其实就是一个Quartz 和Spring的整合过程,很容易实现,但是我们现在企业中项目通常都是 ...

  6. 关于TCP窗口大小

    窗口字段 TCP Window字段用于接收端通知发送端:接收端当前能够接收的字节数(即当前允许发送端发送的字节数).在TCP Header中占有16bit长度,如下所示 0 1 2 3 0 1 2 3 ...

  7. 检查手机是否安装外置SD卡

    /** * 检测是否安装外置SD卡 * * @return */ public boolean checkSDcard() { StorageList list = new StorageList(t ...

  8. 一个c程序反汇编过程（zz）

    zz from http://blog.luoyuanhang.com/ 最基本的反汇编方法是gdb xxx: disassemble main/其他函数 #反汇编一个简单的C程序并分析 C 源码: ...

  9. weblogic中配置数据源

    Weblogic数据源配置 一.配置数据源 1.点击数据源,进入数据源配置页面,点击新建后选择一般数据源 2.输入名称和jndi名称(两个输入一样即可)后点击下一步 3.选择驱动后点击下一步 4.输入 ...

  10. Python批量执行oracle中的insert语句

    从oracle导出一个表的数据,导出的格式是insert语句,数据量30万. 直接在PL/SQL Developer中执行,速度非常慢,脚本中也是100条数据提交一次.因为需要的时间太长,每次中断后, ...