公告滚动想必大家都有见到过吧,实现方法也有很多,下面为大家介绍使用jquery实现垂直公告滚动,感兴趣的朋友不要错过

复制代码代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>jquery垂直公告滚动-www.jbxue.com</title> 
<script src="jquery-1.7.2.js"></script> 
<style> 
*{ 
padding:0px; 
margin:0px; 

ul{ 
list-style:none; 

li{ 
line-height:30px; 

</style> 
</head>

<body> 
<ul> 
<li>1111</li> 
<li>22222</li> 
<li>3333</li> 
<li>44444</li> 
<li>5555</li> 
<li>66666</li> 
</ul> 
<script> 
setInterval(function(){ 
var newList=$('ul :first').clone(true); 
$('ul').append(newList); 
$('ul :first').remove(); 
},2000);

</script> 
</body> 
</html> 

jquery垂直公告滚动实现代码的更多相关文章

  1. jQuery图片无缝滚动JS代码ul/li结构

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. 基于jQuery垂直多级导航菜单代码

    基于jQuery垂直多级导航菜单代码是一款黑色风格的jQuery竖直导航菜单特效下载.效果图如下: 在线预览   源码下载 实现的代码. html代码: <ul class="ce&q ...

  3. jQuery垂直二级导航菜单代码

    http://www.sucaihuo.com/js/395.html 分享一个简单的垂直二级菜单导航.   HTML <div id="my_menu" class=&qu ...

  4. jQuery图片无缝滚动

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. jQuery鼠标滚动垂直全屏切换代码

    体验效果:http://hovertree.com/texiao/jquery/68/ 源码下载:http://hovertree.com/h/bjaf/f643upc4.htm 代码如下: < ...

  6. jQuery实现公告文字左右滚动

    jQuery实现公告文字左右滚动的代码. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &qu ...

  7. jquery 单行滚动、批量多行滚动、文字图片翻屏滚动效果代码

    jquery单行滚动.批量多行滚动.文字图片翻屏滚动效果代码,需要的朋友可以参考下. 以下代码,运行后,需要刷新下,才能加载jquery,要不然看不到效果.一.单行滚动效果 <!DOCTYPE ...

  8. div+css+jQuery图片横向滚动代码(带左右点击按钮)

    首先感谢Blue老师的javascript教程,给了我很多的启发,这是我在看完10 - 定时器的使用 - 2这节视频后,自己试着用jQuery重新改写了一下代码,感觉至少比百度搜出来的那一坨靠谱多了, ...

  9. jquery图片无缝滚动代码左右 上下无缝滚动图片

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. yarn的基本组成和工作流程

    yarn是负责资源管理的,协调各个应用程序的资源使用情况 一.基本组成 yarn主要由以下几个部分组成 1.resourcemanager 主要负责资源的调度和应用程序的管理 (1)调度器 调度器是将 ...

  2. MySQL查询in操作 查询结果按in集合顺序显示(转)

    MySQL 查询in操作,查询结果按in集合顺序显示的实现代码,需要的朋友可以参考下. MySQL 查询in操作,查询结果按in集合顺序显示 复制代码代码如下: select * from test ...

  3. devenv.exe - Assert Failure visual studio 2010

    安装完成devexpress后启动vs提示 devenv.exe - assert failure  第一种在博客园找到的解决方案: 原因是机器上安装了framework 4.5 和4.5中文包,卸载 ...

  4. 在eclipse中运行storm-starter

    开源软件官网提供的demo无疑是学习开源软件的最好的最原始的样例. 在Storm官网里下载apache-storm-0.9.6.zip,里面\examples\storm-starter\src\jv ...

  5. javascript/jquery给动态加载的元素添加click事件

    /** 这种写法:在重新加载数据后事件依然有效*/$(document).on('click', '#district_layer ul li', function () { });

  6. js内置对象处理-打印学生成绩单

    效果图: 任务: 1.通过js的内置对象得到当前日期 var date=new Date(); var year=date.toString().slice(11,15); document.writ ...

  7. dede版权信息修改

    login:dede-templets-login.htm 系统主页:dede-templets-index2.htm 主体内容在index_body.htm文件   干掉: $(function() ...

  8. PHP之基本语法

    人生最幸福的事之一就是,邻居家的wifi密码是123456789,于是回家在pad上也照样可以扯淡.任何语言都有自己的语法,这里只简单说些我觉得应该注意的地方. 首先要明白,PHP是运行于服务器端的脚 ...

  9. ArrayUtils用法

    /* 1. ArrayUtils.isEmpty(strs) : 判断数组是否为空 , 不为空返回false,为空true */     ArrayUtils.isEmpty(new String[] ...

  10. 20160503-spring入门2

    使用Spring需要的jar 到http://www.springsource.org/download下载spring,然后进行解压缩,在解压目录中找到下面jar文件,拷贝到类路径下 dist\sp ...