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. 移除http响应中的多余的头(X-AspNet-Version,Server等)

    网上搜索出很多方法了,这里记录一下: 如果是asp.net mvc的话还得在global.ascx中加入: 至于移除Server头,按网上的写法写httpmoudle后发现无效的,最后还是用了微软官方 ...

  2. Gson 和 FastJson 性能测试

    使用版本: compile 'com.google.code.gson:gson:2.7' compile 'com.alibaba:fastjson:1.2.17' 评测样板为一个People数组, ...

  3. Visual Studio 新建项目报错" this template attempted to load component assembly 'NuGet.VisualStudio.Interop, ….".

    "Error: this template attempted to load component assembly 'NuGet.VisualStudio.Interop, Version ...

  4. Debug Assertion Failed! Expression: _pFirstBlock == pHead

    点击Abort之后,查看调用栈,发现异常在函数return时被时产生,进一步看是vector的析构函数被调用时产生,以前没开发过C++项目,没什么经验,这个错误让我很困惑,第一,我电脑上并没有f盘:第 ...

  5. Quartz的线程池解析

    [org.quartz.core相关类图] 可以看到核心类为QuartzScheduler [QuartzScheduler构造函数] public QuartzScheduler(QuartzSch ...

  6. 在线PDF编辑网站http://www.pdfescape.com

    网站地址:http://www.pdfescape.com 先转载一个简单介绍的文章 如果你以前很少阅读PDF文档,电脑中也没有PDF阅读器:adobe reader,foxit reader之类的软 ...

  7. 2015 Android Dev Summit(安卓开发峰会)第一天

    今年的Google I/O没有抽到票,不能到现场参加.不过11月举行的Android Dev Summit的票是先到先得的方式,所以早早的提交了注册.今天终于有机会当面跟Android系统的设计开发者 ...

  8. Linux RPM 命令参数使用详解

    rpm 执行安装包二进制包(Binary)以及源代码包(Source)两种.二进制包可以直接安装在计算机中,而源代码包将会由 RPM自动编译.安装.源代码包经常以src.rpm作为后缀名. 常用命令组 ...

  9. 如何使用新浪微博账户进行应用登录验证(基于Windows Azure Mobile Service 集成登录验证)

    使用三方账号登录应用应该对大家来说已经不是什么新鲜事儿了,但是今天为什么还要在这里跟大家聊这个话题呢,原因很简单 Windows Azure Mobiles Service Authenticatio ...

  10. mssql表名列名对应语句

    if exists (select * from tempdb..sysobjects where name like '#magic%') drop table #magic go select a ...