转 CSDN Go_Rush (阿舜)
<style>a{display:block;font-size:15px};</style>
<div id="div1" style="width:300px;height:68px;overflow:hidden">
<a href="javascript:">1,你可曾有过无数的梦想,</a>
<a href="javascript:">2,却在时光的流逝里幻灭 </a>
<a href="javascript:">3,你可曾对未来期待憧憬,</a>
<a href="javascript:">4,却在成长的岁月中迷失</a>
<a href="javascript:">5,CSDN中国程序员论坛</a>
<a href="javascript:">6,大家一起来</a>
<a href="javascript:">7,好象都很不错的样子</a>
</div>
<script>
var t=setInterval(myfunc,1000)
var d=document.getElementById("div1")
function myfunc(){
var o=d.firstChild
d.removeChild(o)
d.appendChild(o)
}
d.οnmοuseοver=function(){clearInterval(t)}
d.οnmοuseοut=function(){t=setInterval(myfunc,1000)}
</script>
上面显示的是四行,如果只要1行,或者几行 改这里height:68px
只显示1行:
<div id="div1" style="width:300px;height:15px;overflow:hidden">
---------------------------------------------------------------------------------------------------------------------------------------
图片当然可以啊,除了图片大段大段的html脚本都可以"滚",一次滚一段
<style>img{display:block}</style>
<div id="div1" style="width:221px;height:187px;overflow:hidden">
<img src=http://zi.csdn.net/beijing-nightclass221x187.JPG>
<img src=http://zi.csdn.net/intel-zq221_187.jpg>
<img src=http://zi.csdn.net/microsoft221_187.jpg>
<img src=http://www.csdn.net/adv/homepage/20060429_Martin.gif>
</div>
<script>
var t=setInterval(myfunc,1000)
var d=document.getElementById("div1")
function myfunc(){
var o=d.firstChild
d.removeChild(o)
d.appendChild(o)
}
d.οnmοuseοver=function(){clearInterval(t)}
d.οnmοuseοut=function(){t=setInterval(myfunc,1000)}
</script>
---------------------------------------------------------------------------------------------------------------------------------------
只需要修改几个字符,就可以横着滚
<div id="div1" style="width:884px;height:187px;overflow:hidden">
<img src=http://zi.csdn.net/beijing-nightclass221x187.JPG>
<img src=http://zi.csdn.net/intel-zq221_187.jpg>
<img src=http://zi.csdn.net/microsoft221_187.jpg>
<img src=http://www.csdn.net/adv/homepage/20060429_Martin.gif>
</div>
<script>
var t=setInterval(myfunc,1000)
var d=document.getElementById("div1")
function myfunc(){
var o=d.firstChild
d.removeChild(o)
d.appendChild(o)
}
d.οnmοuseοver=function(){clearInterval(t)}
d.οnmοuseοut=function(){t=setInterval(myfunc,500)}
</script>
----------------------------------------------------------------------------------------------------------------------------------------
另一滚动效果:
Onload里延时1s,1s后出滚动效果
注:里边是《都市男女》台词
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
var j//这个用于取消滚动
function Mov()
{
var div=document.getElementById('test')
if(div.style.pixelTop==-div.clientHeight)
{
div.style.pixelTop=0
j=window.setTimeout('Mov()',1000)
}
else
{
div.style.pixelTop-=10
j=window.setTimeout('Mov()',10)
}
}
</SCRIPT>
</HEAD>
<BODY οnlοad='window.setTimeout("Mov()",1000)'>
<div style="width:100%;height:150px;overflow:hidden">
<div id='test' style='position:absolute'>
<pre>
汤姆:那边窗户亮起来的是什么光?
汤姆:那就是东方
汤姆:她就是美丽的太阳
汤姆:升起来吧,太阳!
汤姆:赶走那妒嫉的月亮(台下安娜的眼睛明显不是味道了)
汤姆:瞧,瞧,她用纤手托住了脸庞
汤姆:那姿势是多么的美妙阿
汤姆:但愿我能成为那只手上的手套
汤姆:(深呼吸)欧,她那闪烁不定的眼睛
汤姆:如同动物园(台下一愣,群体爆笑)
(青青:哎哎哎,正演出呢,你们拿出点诚意和礼貌好不好……切,继续!)
(青青已经完全进入角色了)
汤姆:动物园上空美丽的星星
汤姆:是的,就是你
汤姆:如同恒星一样照耀大地的你
汤姆:世界上一切洁白美好的事物(台下已经傻了)
汤姆:都无法与你相比
汤姆:无知的鸟兽
汤姆:因为说不出你的名字而绝望万分(青青微微点头,已经完全被感动了)
汤姆:所有的路口为了让你顺利通行,而亮起了绿灯
汤姆:如果我是诗人
汤姆:我所有的诗集都只为了歌颂你
汤姆:如果我是法官
汤姆:那么你的好恶,将是我至高无上的法则
汤姆:如果我是哨兵,你的每一个字都是我的口令
汤姆:如果我是项羽,我会带着你临阵脱逃,任人耻笑
(安娜:不对啊,词不对)(PS:汤姆进入角色太深,加上暗恋青青已久,已经窜词了)
汤姆:对我笑吧,就像你我初次相遇
汤姆:对我说吧,哪怕誓言经历不住时间
汤姆:对我哭吧,尽管我只有瘦弱的肩膀(青青已经忍不住要流泪了)
汤姆:你是我寒冬的一袭棉衣
汤姆:酷暑的佰微冰啤(台下人全愣着看汤姆对青青表白)
汤姆:你是带着奥妙味道的真丝衬衫
汤姆:你是我灵感永不衰竭的源泉
汤姆:你是纯洁的,天真的(汤姆深情地眼神)
汤姆:藐视一切的
汤姆:象玻璃一样的,你
(长默……此时台下人已经呆住了)
汤姆:苦味的向导,绝望的领港人
汤姆:带着你的迷惘和厌倦
汤姆:向那岩石上狠狠的冲撞吧
(汤姆走到桌前,拿起酒杯(罗密欧要喝毒酒))
汤姆:为了我的爱人,干了这杯
(杯子掉在地上,汤姆倒地,(青青深情地:罗密欧)挣扎,然后……)
</pre>
</div>
</div>
</BODY>
</HTML>
------------------------------------------------------------------------------------------------------------------------------
现在省略掉一些不必要的变量,这次应该可以了
需要调整的只有iLineHeight、iLineCount两个参数,div的高度任意但最好不要超过全文高度
<style>
div { font-size:12px; }
</style>
<div id="mq" style="width:100%;height:70px;overflow:hidden" οnmοuseοver="iScrollAmount=0"
οnmοuseοut="iScrollAmount=1">
轻轻的我走了,正如我轻轻的来;<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>