CSS

 ul, li {
margin: 0;
padding: 0;
} #scrollDiv {
width: 300px;
height: 25px;
line-height: 25px;
border-bottom: #4c8cd1 1px solid;
overflow: hidden;
} #scrollDiv li {
height: 25px;
padding-left: 10px;
}

  JS

<script>
function AutoScroll(obj) {
$(obj).find("ul:first").animate({
marginTop: "-25px"
}, 800, function () {
$(this).css({ marginTop: "0px" }).find("li:first").appendTo(this);
});
} $(document).ready(function () {
setInterval('AutoScroll("#scrollDiv")', 3000)
setInterval('AutoScroll("#scrollDiv")', 3000)
});
</script>

  HTML

<div id="scrollDiv">
<ul>
<li>这是公告标题的第一行</li>
<li>这是公告标题的第二行</li>
<li>这是公告标题的第三行</li>
<li>这是公告标题的第四行</li>
<li>这是公告标题的第五行</li>
<li>这是公告标题的第六行</li>
<li>这是公告标题的第七行</li>
<li>这是公告标题的第八行</li>
</ul> </div>

  

js不间断滚动的更多相关文章

  1. JavaScript js无间断滚动效果 scrollLeft方法 使用模板

    JavaScript js无间断滚动效果 scrollLeft方法 使用模板 <!DOCTYPE HTML><html><head><meta charset ...

  2. 横向不间断滚动DIV

    横向不间断滚动DIV,5个一组,js控制,自动生成任意组显示 <!DOCTYPE html> <html> <head> <meta http-equiv=& ...

  3. DIV+CSS图片不间断滚动jquery特效(Marquee插件)及移动标签marquee整理

    推荐一个jQuery的无缝文字滚动效果,同时也可以滚动图片,也叫做跑马灯效果. 此jquery插件,依托jquery库,能实现各种滚动效果,且让HTML代码符合W3C标准. marquee标签:创建一 ...

  4. js鼠标滚轮滚动图片切换效果

    效果体验网址:http://keleyi.com/keleyi/phtml/image/12.htm HTML文件代码: <!DOCTYPE html PUBLIC "-//W3C// ...

  5. WOW.js – 在页面滚动时展现动感的元素动画效果

    在一些网页上,当你滚动页面的时候会看到各式各样的元素动画效果,非常动感.WOW.js 就是一款帮助你实现这种 CSS 动画效果的插件,很容易定制,你可以改变动画设置喜欢的风格.延迟.长度.偏移和迭代等 ...

  6. js网页滚动条滚动事件实例分析

    本文实例讲述了js网页滚动条滚动事件用法.分享给大家供大家参考.具体分析如下: 在做js返回顶部的效果时,要监听网页滚动条滚动事件,这个事件就是:window.onscroll.当onscroll事件 ...

  7. js文字向上滚动代码

    js文字向上滚动代码 <style>.pczt_pingfen_jhxs_news1{ width:397px;  background:#edfafd; padding-top:2px; ...

  8. div+css不间断滚动字幕

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  9. js手机号批量滚动抽奖代码实现

    我们平时在看一些选秀节目或一些歌唱类比赛节目时经常会看到在现场的大屏幕上会有观众的手机号在滚动来选出谁是幸运观众或谁中了什么奖项,这些手机号都是现场观众或场外观众在给选手投票时产生的,当主持人一声开始 ...

随机推荐

  1. RAID卡

        简单的说,RAID是一种把多块独立的物理硬盘按不同方式组合起来形成一个逻辑硬盘,从而提供比单个硬盘有着更高的性能和提供数据冗余的技术.     RAID卡一般分为硬RAID卡和软RAID卡两种 ...

  2. Android 6.0 源代码编译实践

    http://www.judymax.com/archives/1087 Android 6.0 源代码编译实践 https://mirrors.tuna.tsinghua.edu.cn/help/A ...

  3. Jenkins 安装或更新插件失败

    试试这个插件网址是否可以在网页中打开 http://mirror.xmission.com/jenkins/updates/current/update-center.json   如可以,把这个网址 ...

  4. android开发(50) Android透明状态栏。适用于 4.4 以上及 5.0以上设备

    概述 有时候我们想在 andorid 手机上实现一种 跨越 顶部状态栏的效果,比如一张图片直接显示在 状态栏内.比如下图: 这个页面里有张图片,这个图片显示在整个页面的上部分.状态栏是 漂浮在这个图片 ...

  5. Spark源码系列(六)Shuffle的过程解析

    Spark大会上,所有的演讲嘉宾都认为shuffle是最影响性能的地方,但是又无可奈何.之前去百度面试hadoop的时候,也被问到了这个问题,直接回答了不知道. 这篇文章主要是沿着下面几个问题来开展: ...

  6. iOS开发备忘录:实现多StoryBoard之间跳转

    iOS项目中可以将同一业务流程的页面归置到一个StoryBoard中,项目中必然会包含多个StroryBoard,可以利用跳转,实现项目的不同业务流程页面间的跳转切换. 实现思路: 1,项目(Proj ...

  7. String.format详解(转)

    一.前言 String.format 作为文本处理工具,为我们提供强大而丰富的字符串格式化功能,为了不止步于简单调用 String.format("Hello %s", " ...

  8. 几种图片下载lib对比

  9. git merge之squash

    看CM源码时,发现历史记录里有很多squash,于是google了解了一下. Git相对于CVS和SVN的一大好处就是merge非常方便,只要指出branch的名字就好了,如: 1 2 3 4 5 $ ...

  10. managed_shared_memory.construct造成的性能损失

    boost中的IPC进程间通信非常好用,可以直接在共享内存上创建对象,相当于new分配器,实测发现它的分配算法还是有点耗时.第一个测试代码仅仅分配一次,然后频繁的复制,每秒钟可以复制4200次左右. ...