JS文字翻滚效果
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JS新闻文字翻滚效</title>
<style>
a{display:block;font-size:15px;line-height:18px;text-decoration:none;color:#333}
.shell{
1122123<img src=http://p1.mb5u.com/texiao/2/20100522231053292.gif>2244234background:url(http://p1.mb5u.com/texiao/2/20100522231053292.gif) no-repeat 4px 5px;
border:1px solid #aaa;
width:386px;
padding:3px 2px 2px 25px;
}
.core{
height:18px;
overflow:hidden;
}
</style>
</head>
<body>
<!--<div class="shell">
<div id="div1" class="core">
<a href="javascript:">jQuery 无刷新切换CSS样式表改变风格</a>
<a href="javascript:">VC++生成随机数并快速排序的算法</a>
<a href="javascript:">基于jQuery的图片滚动切换插件</a>
<a href="javascript:">联想头部大横幅Flash广告附源文件</a>
<a href="javascript:">VB开发的Eclipse编程软件完整版</a>
</div>
</div>-->
<p></p>
<div class="shell">
<div id="div2" class="core">
<a href="javascript:">jQuery 无刷新切换CSS样式表改变风格</a>
<a href="javascript:">VC++生成随机数并快速排序的算法</a>
<a href="javascript:">基于jQuery的图片滚动切换插件</a>
<a href="javascript:">联想头部大横幅Flash广告附源文件</a>
<a href="javascript:">VB开发的Eclipse编程软件完整版</a>
</div>
</div>
<p></p>
<div class="shell">
<div id="div3" class="core">
<a href="javascript:">jQuery 无刷新切换CSS样式表改变风格</a>
<a href="javascript:">VC++生成随机数并快速排序的算法</a>
<a href="javascript:">基于jQuery的图片滚动切换插件</a>
<a href="javascript:">联想头部大横幅Flash广告附源文件</a>
<a href="javascript:">VB开发的Eclipse编程软件完整版</a>
</div>
</div>
<p></p>
<div class="shell">
<div id="div4" class="core">
<a href="javascript:">jQuery 无刷新切换CSS样式表改变风格</a>
<a href="javascript:">VC++生成随机数并快速排序的算法</a>
<a href="javascript:">基于jQuery的图片滚动切换插件</a>
<a href="javascript:">联想头部大横幅Flash广告附源文件</a>
<a href="javascript:">VB开发的Eclipse编程软件完整版</a>
</div>
</div>
<p></p>
<div class="shell">
<div id="div5" class="core">
<a href="javascript:">jQuery 无刷新切换CSS样式表改变风格</a>
<a href="javascript:">VC++生成随机数并快速排序的算法</a>
<a href="javascript:">基于jQuery的图片滚动切换插件</a>
<a href="javascript:">联想头部大横幅Flash广告附源文件</a>
<a href="javascript:">VB开发的Eclipse编程软件完整版</a>
</div>
</div>
</body>
<script>
function myGod(id,w,n){
var box=document.getElementById(id),can=true,w=w||1500,fq=fq||10,n=n==-1?-1:1;
box.innerHTML+=box.innerHTML;
box.onmouseover=function(){can=false};
box.onmouseout=function(){can=true};
var max=parseInt(box.scrollHeight/2);
new function (){
var stop=box.scrollTop%18==0&&!can;
if(!stop){
var set=n>0?[max,0]:[0,max];
box.scrollTop==set[0]?box.scrollTop=set[1]:box.scrollTop+=n;
};
setTimeout(arguments.callee,box.scrollTop%18?fq:w);
};
};
//myGod('div1',10);
myGod('div2',10,-1);
myGod('div3',500,-1);
myGod('div4',500);
myGod('div5',1500,-1);
</script>
</html>
JS文字翻滚效果的更多相关文章
- js文字滚动效果实现
纯js实现,完整代码如下: <!doctype html> <html lang="en"> <head> <meta http-equi ...
- js文字转移效果
这个例子算是有点样子的. 思路: 字符串操作.左框里面先是预设的.点击按钮时截取左框中的字符串的前一个字符到右框里的字符串后面,以此循环.点击按钮时按钮变为灰色,在循环完成后恢复.计数的总数(右边)是 ...
- js文字跳动效果
/*! * chaffle v1.0.0 * * Licensed under MIT * Copyright 2013-2014 blivesta * http://blivesta.com */ ...
- js文字滚动效果
function (global) { var logo = document.getElementById('logo'); var text = document.createTextNode(' ...
- JS 黑客帝国文字下落效果
黑客帝国文字下落效果 源代码如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...
- Android - 文字向上翻滚效果的实现
本文转载https://xwc2013.iteye.com/blog/1976051 今天看到了一种文字翻滚的效果,感觉非常实用.所以就自己试着做出了这种效果,现在把它分享给大家! 首先在res目录下 ...
- js文字展示各种滚动效果
js文字展示各种滚动效果:http://www.dowebok.com/demo/188/
- 使用Three.js实现神奇的3D文字悬浮效果
声明:本文涉及图文和模型素材仅用于个人学习.研究和欣赏,请勿二次修改.非法传播.转载.出版.商用.及进行其他获利行为. 背景 在 Three.js Journey 课程示例中,提供了一个使用 Thre ...
- js文字颜色闪烁
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
随机推荐
- Data Dependency
https://en.wikipedia.org/wiki/Data_dependency (There’s some misleading expression on the flow/data d ...
- 关于Synthesis
1,当追求面积最小时 会以牺牲Fmax为代价,可以使用一下setting: fit_pack_for_density=on fit_report_lab_usage_stats=on 可在 .qsf ...
- 并发和多线程(二)--启动和中断线程(Interrupt)的正确姿势
启动线程: 从一个最基本的面试题开始,启动线程到底是start()还是run()? Runnable runnable = () -> System.out.println(Thread.cur ...
- MySQL其他和备份
目录 事务 存储引擎 InnoDB存储引擎 数据存储形式 锁的粒度 事务 数据的存储特点 MyISAM存储引擎 数据存储形式 锁的粒度 事务 数据的存储特点 其他 对比与选择 视图 触发器 存储过程 ...
- 主机入侵防御系统(HIPS)分析
主机入侵防御系统(Host Intrusion Prevent System,HIPS)是近几年出现并迅速发展的新兴产物,与传统意义的防火墙和杀毒软件不同,它并不具备特征码扫描和主动杀毒等功能,所以想 ...
- Ajax4Jsf 简单介绍
Ajax4jsf 允许开发人员将 Ajax 功能添加到 JSF 应用程序中,而不需要 JavaScript 或用 Ajax 图形部件替换现有的组件.这个包还允许在使用 Java 2D 库时动态地生成图 ...
- JEECMS文库工具安装
下载地址: Swftools下载地址 http://www.swftools.org/swftools-0.9.2.tar.gz openoffice下载地址 http://www.openoffic ...
- 设定计算属性setter
<!DOCTYPE html> <html lang="zh"> <head> <title></title> < ...
- 北京信息科技大学校赛 题解 | AK记录贴
比赛链接:https://ac.nowcoder.com/acm/contest/940#question 花了一天时间全部解决,题目不难,全是基础题+模板题. A - kotori和糖果 链接:ht ...
- 03_Hibernate关系映射
关系映射? Hibernate的主要目的就是JAVA程序员可以随心所欲的使用对象编程思维来操作数据库.一些数据库表的关系我们应该可以通过hibernate实现,比如数据库中用到的主外键关系,还有一些与 ...