文字滚动

marquee的参数如下:
1、方向 direction 值:left, right,up,down
2、方式 bihavior
alternate: 表示在两端之间来回滚动。
scroll: 表示由一端滚动到另一端,会重复。
slide: 表示由一端滚动到另一端,不会重复。
3、循环 loop 值:次数;若未指定或loop=-1则循环不止,默认为-1
4、速度 scrollamount 值:数字,越小越慢,单位pixels
5、延时 scrolldelay 值:数字,越小停顿时间越短,单位millisecond(毫秒)
6、对齐方式 align值:
absbottom:绝对底部对齐(与g、p等字母的最下端对齐)
absmiddle:绝对中央对齐baseline:底线对齐bottom:底部对齐(默认)
left:左对齐 middle:中间对齐 right:右对齐 texttop:顶线对齐
top:顶部对齐
7、底色 bgcolor
#=rrggbb 16 进制数码,或者是下列预定义色彩:
Black, Olive, Teal, Red, Blue, Maroon, Navy, Gray, Lime,
Fuchsia, White, Green, Purple, Silver, Yellow, Aqua
8、面积 9、空白(Margins)

想了解更多marquee方面的内容请进 marquee 文字滚动

例2:文字滚动效果(主要显示上下滚动特效)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>文字向上滚动</title> 
<style type="text/css"> 
.box{width:150px; height:25px;line-height:25px; border:#bbb 1px solid; overflow:hidden;} 
.box ul{margin:0; padding:0} 
.box li{height:25px; line-height:25px; font-size:12px; text-align:center; list-style-type:none;} 
</style> 
</head> 
<body> 
<div class="box" id="marqueebox0"> 
<ul> 
<li style="background:#f8e2ac;">第一行</li>
<li style="background:#f5f5f5;">第二行</li> 
<li style="background:#ffe6ec;">第三行</li> 
</ul> 
</div>
<div class="box" id="marqueebox1"> 
<ul> 
<li style="background:#f8e2ac;">第一行</li> 
<li style="background:#f5f5f5;">第二行</li> 
<li style="background:#ffe6ec;">第三行</li> 
</ul> 
</div> 
<script type="text/javascript"> 
function startmarquee(lh,speed,delay,index){ 
var t;    var p=false; 
var o=document.getElementById("marqueebox"+index); 
o.innerHTML+=o.innerHTML; 
o.onmouseover=function(){p=true} 
o.onmouseout=function(){p=false} 
o.scrollTop = 0; 
function start(){ 
t=setInterval(scrolling,speed); 
if(!p){ o.scrollTop += 1;} 
} 
function scrolling(){ 
if(o.scrollTop%lh!=0){ 
o.scrollTop += 1; 
if(o.scrollTop>=o.scrollHeight/2) o.scrollTop = 0; 
}else{ 
clearInterval(t); 
setTimeout(start,delay); 
} 
} 
setTimeout(start,delay); 
} 
startmarquee(25,30,3000,0); 
startmarquee(25,40,0,1); 
</script> 
</body> 
</html>

想了解更多更详细的文字滚动内容请进 js 文字滚动

Leave a comment

7 Comments.

  1. 这难道就是传说中的程序员 。。。。好痛苦 :cry: :cry: :cry:

  2. 看着这些直头晕:)不过挺羡慕搞IT的,赚钱多,还可以想怎么折腾就怎么折腾

  3. 看着这些都头疼… :shock:

  4. 想学但太难了

发表评论

您的电子邮箱不会被公开。 标记为 * 的区域必须填写

*


您可以使用这些 HTML 标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="">

有人回复时邮件通知我

Trackbacks and Pingbacks: