js特效，轻松实现内容的无缝平滑滚动
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无缝滚动代码示例</title>
<style>
a{}{display:block;font-size:15px};
</style>
<SCRIPT LANGUAGE="JavaScript">
<!--
function scrolln(){
objDiv.scrollTop+=1;
if (objDiv.scrollTop>20) {
objDiv.scrollTop=0;
do{
var objChild=objDiv.firstChild;
objDiv.removeChild(objChild);
objDiv.appendChild(objChild);
}while(!objChild.innerHTML)
}
}
//-->
</SCRIPT>
</head>
<body>
<div id="divMain" style="width:300px;height:68px;overflow:hidden;line-height:20px">
<a href="http://www.livebaby.cn/blog">《戒子篇》-- 诸葛亮</a><br>
<a href="http://www.livebaby.cn/blog">夫君子之行，静以修身，俭以养德。</a><br>
<a href="http://www.livebaby.cn/blog">非澹泊无以明志，非宁静无以致远。</a><br>
<a href="http://www.livebaby.cn/blog">夫学须静也，才须学也，</a><br>
<a href="http://www.livebaby.cn/blog">非学无以广才，非志无以成学，</a><br>
<a href="http://www.livebaby.cn/blog">淫漫则不能励精，险躁则不能治性，</a><br>
<a href="http://www.livebaby.cn/blog">年与时驰，意与日去，</a><br>
<a href="http://www.livebaby.cn/blog">遂成枯落，多不接世，</a><br>
<a href="http://www.livebaby.cn/blog">悲守穷庐，将复何及!</a><br>
<a href="http://www.livebaby.cn/blog">www.livebaby.cn/blog</a><br>
</div>
<div id="divS"></div>
<script>
var tmp=setInterval("scrolln()",100);
var objDiv=document.getElementById("divMain");
objDiv.onmouseover=function(){clearInterval(tmp)}
objDiv.onmouseout=function(){tmp=setInterval("scrolln()",100)}
</script>
</body>
</html>
js特效，轻松实现内容的无缝平滑滚动的更多相关文章
- Javascript做图片无缝平滑滚动
因需要,google得到.作者不详.多谢.我这里略作修改.只是改变了ID. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitio ...
- 页面中的平滑滚动——smooth-scroll.js的使用
正常的本页面锚链接跳转的时候跟PPT似的,特别生硬,用户体验非常差. 这时候我们就可以借助smooth-scroll.js这个插件,来实现本页面的平滑的跳转. 1首先,导入必须的JS文件 <sc ...
- CloudBase CMS + Next.js：轻松构建一个内容丰富的站点
项目背景 试想一下,如果你现在要为你自己或者你所在的组织创建一个强内容的站点,同时要求好的 SEO(搜素引擎优化),比如博客,你会怎么做呢? 由 vite 或者 create-react-app 等脚 ...
- 150个JS特效脚本
收集了其它一些不太方便归类的JS特效,共150个,供君查阅. 1. simplyScroll simplyScroll这个jQuery插件能够让任意一组元素产生滚动动画效果,可以是自动.手动滚动,水平 ...
- 【前端】jQuery实现锚点向下平滑滚动特效
jQuery实现锚点向下平滑滚动特效 实现效果: 实现原理: 使用jQuery animate()方法实现页面平滑滚动特效 $('html, body').animate({scrollTop: $( ...
- js特效 15个小demo
js特效和15个小demo 代码如下:images文件夹未上传 1.图片切换: <!DOCTYPE html> <html> <head> <title> ...
- 36个JS特效教程，学完即精通
6个JS特效教程,学完即精通 JavaScript特效教程,学完你就能写任何特效.本课程将JavaScript.BOM.DOM.jQuery和Ajax课程中的各种网页特效提取出了再进行汇总.内容涵 ...
- 6个JS特效教程，学完即精通
6个JS特效教程,学完即精通 JavaScript特效教程,学完你就能写任何特效.本课程将JavaScript.BOM.DOM.jQuery和Ajax课程中的各种网页特效提取出了再进行汇总.内容涵盖了 ...
- Firebug中调试中的js脚本中中文内容显示为乱码
Firebug中调试中的js脚本中中文内容显示为乱码 设置 页面 UFT-8 编码没用, 解决方法:点击 "Firebug"工具栏 中的"选项"---" ...
随机推荐
- linux基础命令学习 （十一）系统管理命令
stat 显示指定文件的详细信息,比ls更详细 who 显示在线登陆用户 whoami 显示当前操作用户 hostname ...
- 不错的VS2010扩展——JSEnhancements，让js和css也折叠
在Visaul Studio 2010中写js或css代码,缺少像写C#代码时的那种折叠功能,当代码比较多时,就很不方便. 今天发现,已经有VS2010扩展支持这个功能,它就是——JSEnhancem ...
- mysql_fetch_assoc 跟mysql_fetch_array 有什么区别？
mysql_fetch_assoc 得到的是关联数组. Array ( [0] => Array ( [title] => 特价9.9包邮 EFOLAR/依芙拉 BB粉润腮红粉 饼 蘑菇 ...
- (原创)2. WPF中的依赖属性之二
1 依赖属性 1.1 依赖属性最终值的选用 WPF属性系统对依赖属性操作的基本步骤如下: 第一,确定Base Value,对同一个属性的赋值可能发生在很多地方.还用Button的宽度来进行举例,可能在 ...
- Spark Streaming：大规模流式数据处理的新贵（转）
原文链接:Spark Streaming:大规模流式数据处理的新贵 摘要:Spark Streaming是大规模流式数据处理的新贵,将流式计算分解成一系列短小的批处理作业.本文阐释了Spark Str ...
- iOS: 详细的正则表达式
一.简单的正则规则 1.由数字.26个英文字母或者下划线组成的字符串: ^[-9a-zA-Z_]{,}$ 2.非负整数(正整数 + 0 ): ^/d+$ 3. 正整数: ^[-]*[-][-]*$ 4 ...
- 常用EDA工具环境变量配置
# EDA Toolsexport SYNOPSYS_HOME=/home/ProgramFiles/synopsysexport VCS_ARCH_OVERRIDE=linuxexport VCS_ ...
- SPSS Clementine 数据挖掘入门3
转摘:http://www.cnblogs.com/dekevin/archive/2012/04/27/2473683.html 了解SPSS Clementine的基本应用后,再对比微软的SSAS ...
- J2EE 中 用 El表达式 和 Jsp 方式 取得 URL 中的参数方法
使用 el表达式方法: var urlParamValue = "${param.urlVarName}"; 使用 Jsp 表达式 var urlParamValue2 = &qu ...
- Windows10+Ubuntu双系统安装[
数据备份先别着急,你备份了吗?如果你看到这里,说明你选择了风险最大的一条路,在游戏开始之前,一定要做好数据备份,数据备份,数据备份. 创建磁盘分区 按住Win + X,选择“磁盘管理”: 磁盘管理概览 ...