<style> div { font-size:12px; } </style> <div id="mq" style="width:100%;height:70px;overflow:hidden"> 轻轻的我走了,正如我轻轻的来;<br/> 我轻轻的招手,作别西天的云彩。<br/> <br/> 那河畔的金柳,是夕阳中的新娘;<br/> 波光里的艳影,在我心头荡漾。<br/> <br/> 软泥上的青荇,油油的在水底招摇;<br/> 在康河的柔波里,我甘心作一条水草。<br/> <br/> 那榆荫下的一潭,不是清泉是天上的虹;<br/> 揉碎在浮藻间,沉淀彩虹似的梦。<br/> <br/> 寻梦,撑支长篙,向青草更青处漫溯;<br/> 满载一船星辉,在星辉斑烂里放歌。<br/> <br/> 但我不能放歌,悄悄是别离的笙箫;<br/> 夏虫也为我沉默,沉默是今晚的康桥。<br/> <br/> 悄悄的我走了,正如我悄悄的来;<br/> 我挥一挥衣袖,不带走一片云彩。<br/> <br/> </div> <script> var oMarquee = document.getElementById("mq"); //滚动对象 var iLineHeight = 42; //单行高度,像素 var iLineCount = 7; //实际行数 var iScrollAmount = 1; //每次滚动高度,像素 function run() { oMarquee.scrollTop += iScrollAmount; if ( oMarquee.scrollTop == iLineCount * iLineHeight ) oMarquee.scrollTop = 0; if ( oMarquee.scrollTop % iLineHeight == 0 ) { window.setTimeout( "run()", 2000 ); } else { window.setTimeout( "run()", 50 ); } } oMarquee.innerHTML += oMarquee.innerHTML; window.setTimeout( "run()", 2000 ); </script>
<style type="text/css"> <!-- body { text-align:center; } ul{ margin:0px; padding:0px; list-style:none; } #andyscroll { overflow: hidden; background: #E8F8F8; padding: 0 10px; text-align: left; width:400px; height:100px; overflow:hidden; } #andyscroll a { font:12px/18px tahoma; color: #000; float:left; width:100%; text-decoration: none; display:block; } #andyscroll a:hover { font:12px/18px tahoma; color: #F60; } --> </style> <div id="andyscroll"> <div id="scrollmessage"> <UL><li><a href="#">完全兼容IE, FF, Opera, 其它的还未经测试……</a></li> <li><a href="#">代码来自互联网,我只不过稍加整理,希望大家多提意件……</a></li> <li><a href="#">完全兼容IE, FF, Opera, 其它的还未经测试……</a></li> <li><a href="#">代码来自互联网,我只不过稍加整理,希望大家多提意件……</a></li> <li><a href="#">完全兼容IE, FF, Opera, 其它的还未经测试……</a></li> <li><a href="#">代码来自互联网,我只不过稍加整理,希望大家多提意件……</a></li> <li><a href="#">完全兼容IE, FF, Opera, 其它的还未经测试……</a></li> <li><a href="#">代码来自互联网,我只不过稍加整理,希望大家多提意件……</a></li> <li><a href="#">完全兼容IE, FF, Opera, 其它的还未经测试……</a></li> <li><a href="#">代码来自互联网,我只不过稍加整理,希望大家多提意件……</a></li> <li><a href="#">完全兼容IE, FF, Opera, 其它的还未经测试……</a></li> <li><a href="#">代码来自互联网,我只不过稍加整理,希望大家多提意件……</a></li> </ul> </div> </div> <script type="text/javascript"> <!-- var stopscroll = false; var scrollElem = document.getElementById("andyscroll"); var marqueesHeight = scrollElem.style.height; scrollElem.onmouseover = new Function('stopscroll = true'); scrollElem.onmouseout = new Function('stopscroll = false'); var preTop = 0; var currentTop = 0; var stoptime = 0; var leftElem = document.getElementById("scrollmessage"); scrollElem.appendChild(leftElem.cloneNode(true)); init_srolltext(); function init_srolltext(){ scrollElem.scrollTop = 0; setInterval('scrollUp()', 25);//的面的这个参数25, 是确定滚动速度的, 数值越小, 速度越快 } function scrollUp(){ if(stopscroll) return; currentTop += 2; //设为1, 可以实现间歇式的滚动; 设为2, 则是连续滚动 if(currentTop == 19) { stoptime += 1; currentTop -= 1; if(stoptime == 180) { currentTop = 0; stoptime = 0; } }else{ preTop = scrollElem.scrollTop; scrollElem.scrollTop += 1; if(preTop == scrollElem.scrollTop){ scrollElem.scrollTop = 0; scrollElem.scrollTop += 1; } } } </script> //-->
发表评论
-
转载:jquery webservice 跨域
2013-01-28 16:06 1295现在的JQuery中$.ajax方法支持跨域读取json数 ... -
变更地址栏参数
2011-09-14 10:06 826<html> <head ... -
仿google 日历
2011-08-24 23:10 908仿google 日历仿google 日历仿google 日历仿 ... -
Jquery fullcalendar 官方中文文档
2011-08-22 08:47 25211. 使用方式, 引入相关js, css后, $(‘#div_ ... -
js webservice
2011-05-12 08:50 11131. 创建webservice,为了免于落俗我稍稍修改了 ... -
光标位置函数
2010-12-16 12:44 819function getCursortPosi ... -
select元素javascript常用操作
2010-12-14 09:32 659东西很简单,只是自己记性不好,经常忘记一些关键字 所以发 ... -
cookie
2010-09-17 09:06 705function SetCookie(CookieNa ... -
webservice and js
2010-06-24 09:17 849jQuery调用WebService网上的介 ... -
js 类的实现 转载
2010-05-14 10:43 795JavaScript本身并不是设计成面向对象的,所以没 ... -
jsxiaoguo
2009-05-14 10:52 741jsxiaoguo -
窗体大小
2009-05-12 09:39 907网页可见区域宽:document.body.clientWid ... -
闭包小例
2009-02-05 08:53 756//A是一个普通的函数 ... -
js other event target
2008-11-20 14:41 1160解耦导航模式 function Onclick(evt) ... -
用 javascript 处理 JSON
2008-11-19 14:33 1312用 javascript 处理 JSON 关键字: json ... -
js 倒计时
2008-11-13 09:28 994<!doctype html public " ... -
Javascript中最常用的55个经典技巧
2008-09-27 17:47 8911. oncontextmenu="window.e ... -
js xml
2008-09-17 10:53 1225loadXML = function(xmlFile) ... -
正则表达式
2008-09-12 09:04 833数:44] //校验是否全由数字组成 function ... -
js 函数
2008-09-11 13:12 8241.document.write(""); ...
相关推荐
JavaScript滚动延时加载,也称为懒加载(Lazy Loading),是一种优化网页性能的技术。它主要应用于大量数据或图像的页面,通过只在用户滚动到可视区域时才加载相关内容,从而减少初次加载页面时的数据量,提高页面...
JavaScript滚动条是一个重要的前端开发话题,它涉及到网页用户体验的优化和界面交互的增强。传统的HTML滚动条虽然功能基本,但其样式和交互性往往不能满足现代网页设计的需求。因此,"New js 滚动条"通常是利用...
首先,js滚动条源码通常是通过JavaScript编程语言实现的自定义滚动条解决方案。相比于浏览器默认的滚动条样式,自定义滚动条可以提供更美观、更具交互性的体验。开发者可以调整滚动条的宽度、颜色、形状等属性,使之...
JS滚动条属性值,取得滚动条各种数据值,简单处理JS操作滚动条
对于初学者,可以参考压缩包中的示例代码,逐步理解并实践JavaScript滚动效果的实现过程。对于有经验的开发者,这些实例也能提供灵感,帮助快速构建自定义的滚动功能。 总的来说,“js滚动集合”是一个实用的资源,...
通过这个js滚动最新消息的demo,开发者可以学习到JavaScript在实际项目中的应用,了解如何结合DOM操作、事件处理、动画和响应式设计来创建交互式用户体验。同时,这也是提升JavaScript技能和深入理解前端开发的好...
本教程将详细介绍如何使用dhtmlxSlider来实现JavaScript滚动条。 首先,dhtmlxSlider不仅限于滚动条,它还支持创建滑块组件,可以用于数值选择、音量控制、进度条等场景。其主要特点包括高度可定制的外观、多种操作...
JavaScript滚动插件是一种用于网页动态滚动效果的工具,它能够为网页添加丰富的视觉效果,提升用户体验。在网页设计中,滚动效果通常是必不可少的元素,它可以让用户以更自然的方式浏览内容,尤其是对于长页面和单页...
JavaScript滚动条是一个重要的前端开发话题,它涉及到网页用户体验和页面交互设计。JavaScript允许开发者对浏览器的默认滚动行为进行自定义,以实现更加丰富和个性化的界面效果。在本项目中,"javascript滚动条"可能...
总的来说,ScrollBot是一个强大的纯JavaScript滚动条美化工具,它提供了一种灵活、可定制的解决方案,让开发者能够为网站创造出独特且美观的滚动体验。通过深入理解ScrollBot的配置选项和使用方法,你可以进一步提升...
JavaScript滚动特效是一种常见的网页交互设计,它通过JavaScript代码来实现页面元素的动态滚动效果,比如导航菜单、新闻滚动、图片轮播等。这种特效能够提升用户体验,使网站更具活力和吸引力。JavaScript滚动特效...
在本主题中,“js滚动淡入浅出的效果”是指利用JavaScript技术实现的一种网页滚动时元素逐渐显现的视觉特效。这种效果通常通过调整元素的透明度或高度来实现,给用户带来平滑、自然的浏览体验。 1. **JavaScript...
本文将深入解析如何利用JavaScript(简称JS)来创建滚动字幕,并结合给定的代码示例进行详细说明。 #### 原理概述 滚动字幕的基本原理是通过不断改变`<div>`元素的`scrollTop`属性,使内部内容看起来像是在上下...
在这个"js滚动案例"中,我们关注的是如何利用JavaScript实现网页滚动效果。通过提供的文件1.html、2.html、2.js和1.js,我们可以探讨以下几个关键知识点: 1. **DOM操作**: - JavaScript能够通过Document Object ...
在本主题中,"JS滚动效果,首页滚动显示"是指利用JavaScript技术实现网站首页内容随着用户滚动页面时动态显示的效果。这种效果可以提升用户体验,使得信息展示更加流畅且吸引注意力。 在首页滚动显示中,常见的应用...
标题中的“一款效果很不错的JS滚动条”指的是一个JavaScript实现的滚动条插件或库,它提供了优于浏览器默认滚动条的视觉效果和交互体验。在网页设计中,滚动条是必不可少的元素,尤其是在内容丰富的页面上,它帮助...
【标题】"简单JS随滚动条滚动导航"所涉及的知识点主要集中在JavaScript的事件监听、DOM操作以及CSS样式实现上。这种类型的导航栏通常用于网页设计中,它能随着用户滚动页面而改变位置,始终保持在可见区域,为用户...
综上所述,这个压缩包提供了一个兼容IE6的商城产品图JavaScript滚动放大效果的完整解决方案,包括前端展示的HTML、CSS以及JavaScript代码,还有相关的使用说明和图片资源。开发者可以通过学习和使用这些资源,为自己...
MSClass 通用不间断滚动JS封装类 的使用说明: 该Js类可设置各种形式的滚动效果,可随意将您的产品图片、新闻等内容设置为滚动。 上下左右、整屏、间歇式、延时滚动==效果均可实现。兼容所有主流浏览器。。。。
总的来说,这个JS滚动新闻的实现展示了如何使用JavaScript和HTML5来创建一个跨浏览器的动态效果,同时考虑了向后兼容性,特别是对于老版本的IE6。对于初学者和有经验的开发者来说,都是一个很好的学习案例,可以帮助...