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"工具栏 中的"选项"---" ...
随机推荐
- Ext文本输入框:Ext.form.TextField属性汇总（转） (
本章介绍Ext.form.TextField组件的基本用法: <form id="form1" runat="server"> <div ...
- ExtJS ComboBox同时加载远程和本地数据
ExtJS ComboBox同时加载远程和本地数据 原文:http://gblog.hbcf.net/index.php/archives/233 ComboBox比较特殊需求,将远程数据和本地数据同 ...
- HDU 4687 Boke and Tsukkomi （一般图匹配带花树）
Boke and Tsukkomi Time Limit: 3000/3000 MS (Java/Others) Memory Limit: 102400/102400 K (Java/Othe ...
- Codeforces Round #247 (Div. 2) ABC
Codeforces Round #247 (Div. 2) http://codeforces.com/contest/431 代码均已投放:https://github.com/illuz/Wa ...
- The Eclipse runtime options
Version 3.6 - Last revised August 5, 2009 The Eclipse platform is highly configurable. Configuration ...
- spingBoot-自定义过滤器
package com.cx.springboot.filters; import java.io.IOException; import javax.servlet.Filter; import j ...
- 【spring cloud】子模块module -->导入一个新的spring boot项目作为spring cloud的一个子模块微服务，怎么做/或者 每次导入一个新的spring boot项目，IDEA不识别子module，启动类无法启动/右下角没有蓝色图标
如题:导入一个新的spring boot项目作为spring cloud的一个子模块微服务,怎么做 或者说每次导入一个新的spring boot项目,IDEA不识别,启动类无法启动,怎么解决 下面分别 ...
- RapidSVN的使用
RapidSVN是一个可视化 SVN 客户端,运行速度快,简单易用,现在很多已经做成做成便携版,安装都不用.小乌龟那个SVN感觉太复杂了...不妨试下这个. 1.下载安装 2.运行RapidSVNPo ...
- 第一篇 对Javascript中原型的深入理解
理解原型对象 在Javascript中不管什么时候,仅仅要创建一个新的函数,就会依据一组特定的规则为该函数创建一个prototype属性,这个属性指向函数的原型对象(这个对象的用途是包括能够有特定 ...
- python接口自动化23-token参数关联登录（登录拉勾网）
前言 登录网站的时候,经常会遇到传token参数,token关联并不难,难的是找出服务器第一次返回token的值所在的位置,取出来后就可以动态关联了 登录拉勾网 1.先找到登录首页https://pa ...