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/ ...
随机推荐
- html--伪等高布局
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...
- php访问其他网站接口
使用函数: file_get_contents($url); 传入接口url及其参数:如 $url="http://192.168.1.1/test.jsp?id=1&type=2 ...
- show master status
只有在主库上执行才能有效抵输出: 具体文档如下: # 在127.:3306主库上执行 tmp@127.0.0.1 ((none))> show variables like '%server%' ...
- 【JZOJ2679】跨时代
description 钟逆时针而绕,恶物狰狞的倾巢,我谦卑安静地于城堡下的晚祷,压抑远古流窜的蛮荒暗号,而管风琴键高傲的说,那只是在徒劳.我的乐器在环绕,时代无法淘汰我霸气的皇朝. 你无法预言,因为 ...
- Excel生成Oracle数据库表sql工具类
1.解决问题: 开发文档中字段比较多的时候,建表sql(Oracle下划线命名规范)比较麻烦,容易出错~~ (主要是懒) 特意手写一个工具,根据excel字段,生成建表的sql语句. ~~~末尾附Gi ...
- springboot thymeleaf ----服务端渲染html
一. 引用命名空间 <html xmlns:th="http://www.thymeleaf.org"> 不这么写 html标签没闭合会报错 二.实际内容在../sta ...
- 用maven创建Spring MVC项目
用maven创建Spring MVC项目 mvn archetype:generate -DgroupId=fry-arthur -DartifactId=spring-mvc-study -Darc ...
- nginx 遇见问题与解决问题
如果你的安装目录为/usr/local/nginx,那么nginx的错误日志目录就是/usr/local/nginx/logs/error.log. 2.如果error.log不存在 就进入 # vi ...
- 转:进程上下文VS中断上下文
源地址:http://www.cnblogs.com/zzx1045917067/archive/2012/12/19/2824552.html 内核空间和用户空间是现代操作系统的两种工作模式,内核模 ...
- HTML给div设置百分比高度无效的解决方式 - 库塔姆斯 - CSDN博客
原文:HTML给div设置百分比高度无效的解决方式 - 库塔姆斯 - CSDN博客 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/HobHunter ...