`
xunSir.lee
  • 浏览: 45144 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

模拟 marquee

阅读更多
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<style>
* {
	margin: 0; padding: 0;
}
#room div {
	height: 15px; width: 100px; overflow: hidden;
	background: green;  padding:0px; margin: 0; 
}
</style>
<script src="jquery-1.3.min.js"></script>
<script>
$(document).ready(function(){
	setTimeout("scroll_room()", 3000);
});
var i_cc=2, cc;
function scroll_room () {
	$("#room").animate({ top: "-=15px"},   800);
	if (!cc) {
		cc = document.getElementById("room").getElementsByTagName("div").length;
	}
	if (i_cc++ >= cc) {
		i_cc = 2;
		setTimeout('$("#room").css("top", "15px");', 2900);
		setTimeout("scroll_room()", 3000);
	} else {
		setTimeout("scroll_room()", 3000);
	}
}
</script>
</head>

<body>
	<div style="width: 300px; height: 15px; margin: 100px auto; position:relative; background: #666; overflow: hidden;">
		<div id="room" style="position: absolute;">
			<div>11111111111</div>
			<div>222222222222</div>
			<div>33333333333</div>
			<div>444444444444</div>
			<div>55555555555</div>
		</div>
	</div>    
</body>
</html>

 

分享到:
评论

相关推荐

    用javascript模拟marquee实现滚动.htm

    然而,通过JavaScript,我们可以实现更灵活、更可控的滚动效果,这就是"用javascript模拟marquee实现滚动"的主题。 首先,我们需要了解JavaScript的基础。JavaScript主要由变量、数据类型、操作符、语句、函数等...

    jQuery模拟Marquee实现无缝滚动效果完整实例

    首先,介绍模拟Marquee实现无缝滚动效果的CSS部分。为了实现水平滚动,通常需要设置一个容器,限制它的宽度和高度,然后利用CSS的overflow属性隐藏超出部分。在水平滚动的示例中,我们可以看到有一个class为"marquee...

    javascript 模拟Marquee文字向左均匀滚动代码

    因此,开发者常常使用JavaScript来模拟Marquee效果,以实现更灵活、定制化的滚动动画。本篇将深入讲解如何使用JavaScript模拟Marquee文字向左均匀滚动。 首先,我们需要了解HTML中的Marquee标签的基本用法。Marquee...

    jQuery 模拟 Marquee 无缝滚动 不间断滚动

    Marquee 效果是传统 HTML 中的一种标签,用于实现文本或图像的不间断滚动,但在现代 web 开发中,我们通常使用 jQuery 来模拟这种效果,因为它提供了更大的灵活性和控制力。本文将深入探讨如何使用 jQuery 创建一个...

    jQuery实现模拟marquee标签效果

    总的来说,jQuery模拟marquee效果的关键在于利用JavaScript和jQuery的动画功能,通过动态修改元素的位置来创造出滚动的错觉。这种方法相比传统的marquee标签,提供了更多的控制权和兼容性。你可以通过调整速度、暂停...

    JS无间隔滚动代码,javascript,marquee

    然而,我们仍可以通过JavaScript来模拟marquee的效果,甚至可以做得更好,更可控。 创建一个无间隔滚动的JavaScript代码,主要涉及以下几个核心概念: 1. **DOM操作**:首先,你需要通过JavaScript获取到需要滚动...

    利用Marquee实现无缝循环滚动文字

    不过,在提供的代码片段中,并没有直接使用HTML标准中的`&lt;marquee&gt;`标签,而是通过JavaScript结合CSS来模拟了类似的效果。接下来,我们将深入探讨`&lt;marquee&gt;`标签的基本用法以及如何通过JavaScript和CSS实现相同的...

    用javascript实现代替marquee的滚动字幕效果代码

    由于marquee标签现在用得是越来越少了,所以滚动效果的做法大多也都改用javascript来实现了之所以抛弃marquee是因为marquee是一个严重影响...简直是笑话第一种方法:用javascript模拟marquee的做法。 出处:网易游戏

    js实现marquee标签

    然而,由于`&lt;marquee&gt;`不被现代浏览器广泛支持,我们需要用JavaScript来模拟这一效果。在提供的压缩包中,有两个文件:`js仿mequee.htm`和`JSmarquee.js`。`js仿mequee.htm`可能是HTML文件,包含一个或多个需要滚动...

    juqery实现marquee的效果

    因此,我们通常会借助JavaScript,如jQuery,来模拟这个效果。 在jQuery中,我们可以利用CSS属性和定时器来创建自定义的滚动动画。首先,在`index.html`文件中,你需要引入jQuery库,这可以通过CDN链接或者将库文件...

    marquee.js插件演示9种jQuery滚动效果

    7. **弹性滚动**:内容在滚动到尽头时具有弹跳效果,模拟真实物理运动。 8. **渐进式滚动**:内容逐渐显现,而不是一次性全部显示,增强视觉冲击力。 9. **随机滚动**:滚动方向和速度随机变化,让页面保持活力和...

    js Marquee上下滚动效果

    【JS Marquee上下滚动效果详解】 在网页设计中,Marquee元素常被用来实现文本或图像的滚动展示,尤其在有限的空间内展示大量信息时非常实用。本篇将深入讲解如何利用JavaScript实现一个上下滚动的效果,并参考提供...

    用Javascript来实现Marquee效果

    传统的Marquee效果可以通过HTML `&lt;marquee&gt;` 标签实现,但由于该标签在HTML5中已被废弃,因此现代网页通常采用JavaScript和CSS来模拟这种效果。本文将详细介绍如何使用JavaScript来实现一个自定义的Marquee效果,并...

    基于jQuery实现一个marquee无缝滚动的插件

    因此,开发基于jQuery的插件来模拟marquee效果成为一种替代方案。 知识点三:无缝滚动的实现 无缝滚动通常指的是内容在滚动到末端后,可以无间断地从开始处继续滚动,给人一种连绵不断的感觉。实现无缝滚动的关键...

    Paint_Canvas_Android_Marquee

    这通常通过重写`onDraw()`方法来实现,不断改变文本的绘制起始位置,模拟出滚动效果。 2. **定时器**:为了实现持续滚动,开发者会使用`Handler`或`Timer`来定期执行滚动操作。在每个时间间隔内,文本的位置会发生...

    Marquee仿照LED广告文字滚动 可设置滚动速度 滚动的方向,文字大小,文字颜色

    在Android开发中,"Marquee仿照LED广告文字滚动"是一种常见的UI效果,它能够模拟LED显示屏上的文字滚动效果,通常用于制作广告、通知或标题等动态展示内容。本资源提供的代码示例允许开发者自定义滚动速度、方向、...

    Marquee Scroll通用不间断滚动JS封装类

    `setTimeout`或`requestAnimationFrame`用于每隔一定时间更新元素的位置,从而模拟滚动。`requestAnimationFrame`相比`setTimeout`更适用于动画,因为它与浏览器渲染帧同步,能提供更流畅的动画效果。 5. **事件...

Global site tag (gtag.js) - Google Analytics