◎ direction表示滚动的方向，值可以是left，right，up，down，默认为left
◎ behavior表示滚动的方式，值可以是scroll（连续滚动）slide（滑动一次）alternate（往返滚动）
◎ loop表示循环的次数，值是正整数，默认为无限循环
◎ scrollamount表示运动速度，值是正整数，默认为6
◎ scrolldelay表示停顿时间，值是正整数，默认为0，单位似乎是毫秒
◎ align表示元素的垂直对齐方式，值可以是top，middle，bottom，默认为middle
◎ bgcolor表示运动区域的背景色，值是16进制的RGB颜色，默认为白色
◎ height、width表示运动区域的高度和宽度，值是正整数（单位是像素）或百分数，默认width=100% height为标签内元素的高度
◎ hspace、vspace表示元素到区域边界的水平距离和垂直距离，值是正整数，单位是像素。
◎ onmouseover=this.stop() onmouseout=this.start()表示当鼠标以上区域的时候滚动停止，当鼠标移开的时候又继续滚动。
由于marquee标签现在用得是越来越少了，所以滚动效果的做法大多也都改用javascript来实现了.H5里面好像没有什么替代marquee的吧。如果有请共享。互相学习。
下面是js实现代码：
body {margin: 0px
font-size: 12px
color: #938C43
line-height: 150%
text-align:center
}
a:link{color: #9D943Afont-size:12px}
a:hover{color: #FF3300font-size:12px}
a:visited{color: #9D943Afont-size:12px}
a.red:link{color: #ff0000font-size:12px}
a.red:hover{color: #ff0000font-size:12px}
a.red:visited{color: #ff0000font-size:12px}
#marqueeBox{background:#f7f7f7border:1px solid silverpadding:1pxtext-align:centermargin:0 auto}
-->
</style>
</head>
<body>
<h4>滚动新闻</h4>
<script language="JavaScript" type="text/javascript">
var marqueeContent=new Array()
marqueeContent[0]="<a href=http://xyq.163.com/news/2006/11/2-2-20061102170913.html target=_blank>用快速取回帐号密码</a>"
marqueeContent[1]="<a href=http://ekey.163.com/ target=_blank>网易将军令官方网站</a>"
marqueeContent[2]="<a href=http://xyq.163.com/download/wallpaper.htm target=_blank>最新壁纸下载</a>"
marqueeContent[3]="<a href=http://xyq.163.com/download/around.htm target=_blank>最新屏保下载</a>"
var marqueeInterval=new Array()
var marqueeId=0
var marqueeDelay=2000
var marqueeHeight=20
function initMarquee() {
var str=marqueeContent[0]
document.write('<div id="marqueeBox" style="overflow:hiddenwidth:250pxheight:'+marqueeHeight+'px" onmouseover="clearInterval(marqueeInterval[0])" onmouseout="marqueeInterval[0]=setInterval(\'startMarquee()\',marqueeDelay)"><div>'+str+'</div></div>')
marqueeId++
marqueeInterval[0]=setInterval("startMarquee()",marqueeDelay)
}
function startMarquee() {
var str=marqueeContent[marqueeId]
marqueeId++
if(marqueeId>=marqueeContent.length) marqueeId=0
if(document.getElementById("marqueeBox").childNodes.length==1) {
var nextLine=document.createElement('DIV')
nextLine.innerHTML=str
document.getElementById("marqueeBox").appendChild(nextLine)
}
else {
document.getElementById("marqueeBox").childNodes[0].innerHTML=str
document.getElementById("marqueeBox").appendChild(document.getElementById("marqueeBox").childNodes[0])
document.getElementById("marqueeBox").scrollTop=0
}
clearInterval(marqueeInterval[1])
marqueeInterval[1]=setInterval("scrollMarquee()",20)
}
function scrollMarquee() {
document.getElementById("marqueeBox").scrollTop++
if(document.getElementById("marqueeBox").scrollTop%marqueeHeight==(marqueeHeight-1)){
clearInterval(marqueeInterval[1])
}
}
initMarquee()
</script>
</body>
webgl 组件 three.js组件，都可以做到，是专门做的3d效果，不过低版本的浏览器不支持，这是html5里的，希望能帮到你呀！http://www.hewebgl.com/ 这个中文网，英语可以看英语文档，哪样最好！！！！欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）