网页移动代码大全,很值得收藏!

 
一、从右向左移


代码
<marquee direction=left>需要移动的文字</marquee>


二、从左向右移


代码
<marquee direction=right>需要移动的文字</marquee>


三、一圈一圈绕着移动


代码
<marquee behavior=scroll>需要移动的文字</marquee>


四、只移动三次就停了


代码
<marquee loop=3 behavior=slide>需要移动的文字</marquee>


五、移一步,停一停


代码
<marquee scrolldelay=500 scrollamount=100>需要移动的文字</marquee>


六、左右来回移动


代码
<marquee behavior=alternate>需要移动的文字</marquee>


七、忽隐忽现移动


代码
<marquee behavior="alternate"><marquee width="150" direction=right>需要移动的文字</marquee>


八、从下向上移动


代码
<marquee direction=up><div align="center">需要移动的文字</div></marquee>


九 、从上向下移动


代码
<marquee direction=down><div align="center">需要移动的文字</div></marquee>


十、垂直往复移动


代码
<marquee direction=up behavior=alternate><div align="center">需要移动的文字</font></div></marquee>


十一、从左上向右下移动


代码
<marquee direction=right><marquee width=216 direction=down>需要移动的文字</marquee>


十二、 从右上向左下移动


代码
<marquee direction=left><marquee direction=down>需要移动的文字</marquee>


十三、从左下向右上移动


代码
<marquee direction=right><marquee direction=up>需要移动的文字</marquee>


十四、从右下向左上移动


代码
<marquee direction=left><marquee direction=up>需要移动的文字</marquee>


十五、水平相反移动


代码
<p align=center> <marquee width="216px">需要移动的文字</marquee><marquee width="216px" direction=right>需要移动的文字
</marquee></p>


十六、左右两边向中间移动


代码
<p align=center><marquee style="width:216px;" direction=right>需要移动的文字</marquee><marquee style="width:216px;"
direction=left>需要移动的文字</marquee></p>


十七、左右两边向中间来回移动


代码
<MARQUEE scrollAmount=3 behavior=alternate width="40%">左右向中间来回移动</MARQUEE><MARQUEE scrollAmount=3 direction=right
behavior=alternate width="40%">动移回来间中向右左</MARQUEE>


十八、从上下向中间移动


代码
<p></p><center><marquee width=288 direction=down scrollAmount=2 height=50><center>需要移动的文字
</center></marquee><center><marquee width=288 direction=up scrollAmount=2 height=50><center>需要移动的文字
</center></marquee></center></center><p></p>


十九、从中间向上下移动


代码
<p></p><center><marquee width=288 direction=up scrollAmount=2 height=50><center>需要移动的文字
</center></marquee><center><marquee width=288 direction=down scrollAmount=2 height=50><center>需要移动的文字
</center></marquee></center></center><p> </p></marquee>


二十、上下向中间来回移动


代码
<MARQUEE scrollAmount=1 direction=down behavior=alternate height=50><DIV align=center>上下向中间来回移动
</DIV></MARQUEE><MARQUEE scrollAmount=1 direction=up behavior=alternate height=50><DIV align=center>上下向中间来回移动
</DIV></MARQUEE>


二十一、上下交替移动


代码
<marquee direction=up behavior=alternate width=45 height=160><center>需</center></marquee><marquee direction=up
behavior=alternate width=45><center>要</center></marquee><marquee direction=up behavior=alternate width=45
height=160><center>移</center></marquee><marquee direction=up behavior=alternate width=45><center>动
</center></marquee><marquee direction=up behavior=alternate width=45 height=160><center>的</center></marquee><marquee
direction=up behavior=alternate width=45><center>文</center></marquee></marquee><marquee direction=up behavior=alternate
width=45 height=160><center>字</center></marquee>


二十二、移动后消失


代码
<marquee style="width: 288px; height: 120px" scrollAmount=5 direction=up><center><div><marquee direction=up
behavior=alternate width=30 height=100><center>需</center></marquee><marquee direction=up behavior=alternate width=30
height=110><center>移</center></marquee><marquee direction=up behavior=alternate width=30 height=100><center>要
</center></marquee><marquee direction=up behavior=alternate width=30 height=110><center>动</center></marquee><marquee
direction=up behavior=alternate width=30 height=100><center>的</center></marquee><marquee direction=up behavior=alternate
width=30 height=110><center>字</center></marquee><marquee direction=up behavior=alternate width=30 height=100><center>文
</center></marquee></div></center></marquee>


二十三、波浪式移动


代码
<div align=center><marquee width=288
filter: wave(add=0,lightstrength=50,strength=3,freq=2,
phrase=10); scrollAmount=5 direction=up behavior=alternate><div align=center><marquee scrollAmount=3 behavior=altrnate
width=216><div align=center>需要移动的文字</div></marquee></div></marquee></div>


二十四、往复波浪式移动


代码
<marquee width=288 filter: wave(add=0,lightstrength=50,strength=3,freq=2,phrase=10); scrollAmount=5 direction=up
behavior=alternate><marquee scrollAmount=3 behavior=alternate width=288>需要移动的文字</marquee></marquee>


二十五、交替往复波浪式移动


代码
<marquee width=436 scrollAmount=5 direction=right behavior=alternate><marquee direction=up behavior=alternate width=50
height=200 align="middle">需</marquee><marquee direction=up behavior=alternate width=50 height=150>的</marquee><marquee
direction=up behavior=alternate width=50 height=200>要</marquee><marquee direction=up behavior=alternate width=50 height=150>
文</marquee><marquee direction=up behavior=alternate width=50 height=200>移</marquee><marquee direction=up behavior=alternate
width=50 height=150>字</marquee><marquee direction=up behavior=alternate width=50 height=200>动</marquee>
</marquee>


二十六、S型移动


代码
<marquee behavior=alternate direction=up scrollamount=2 scrolldelay=65 height=120 style="Text-align;filter:wave
(add=0,phase=1, freq=1,strength=50,color=.ffffff)"><center>需要移动的文字</center></marquee>
二十七、 多层多式复合移动


代码
<table bgcolor="#ffffff"> <tr><td width="1" valign="top" > <marquee direction="down" behavior="alternate" scrollamount=1
height="120"> <marquee direction="right" scrollamount=4 behavior="alternate" width="288">需要移动的文字</marquee> </marquee>
</td> <td width="288"> <marquee behavior=alternate direction=up scrollamount=2 scrolldelay=65 height="120" width="288"
style="Text-align;filter:wave(add=1,phase=4, freq=1,strength=50)"><center>需要移动的文字</center></marquee></td></tr></table>


二十八、文字竖排渐出移动


代码
<div align=center><marquee scrollAmount=1 scrollDelay=100 behavior=slide loop=1 width=290 height=180><marquee style="line-
height: 120%; writing-mode: tb-rl" scrollAmount=1 scrollDelay=100 direction=up width=290 height=180><p align=center>需要移动
的字文<br>.<br>.<br>.<br>需<br>要<br>移<br>动<br>的<br>文<br>字<br>.<br>.<br>.</p></marquee></marquee></div>
二十九、文字穿梭移动


代码
<marquee scrollAmount=2 width=30 height=20>文&nbsp;&nbsp;&nbsp;&nbsp;文</marquee>&nbsp;&nbsp;&nbsp;&nbsp;<marquee
scrollAmount=2 width=30 height=20>字&nbsp;&nbsp;&nbsp;&nbsp;字</marquee>&nbsp;&nbsp;&nbsp;&nbsp;<marquee scrollAmount=2
width=30 height=20>穿&nbsp;&nbsp;&nbsp;&nbsp;穿</marquee>&nbsp;&nbsp;&nbsp;&nbsp;<marquee scrollAmount=2 width=30 height=20>
梭&nbsp;&nbsp;&nbsp;&nbsp;梭</marquee>&nbsp;&nbsp;&nbsp;&nbsp;


附 注
各主要参数的含义:
align:是设定活动对象(图片或文字)的位置。
direction:用于设定活动对象的移动方向。
behavior="scroll"表示由一端移动到另一端。
behavior="slide"表示由一端移动到另一端,且不再重复。
behavior="alternate"表示在两端之间来回移动。
height:用于设定移动对象的高度。
width:则设定移动对象的宽度。
hspace:用于设定移动对象的左右边框宽度。
vspace:上下边框的宽度。
scrollamount:用于设定活动对象的移动距离,数值越大移动越快。
scrolldelay:用于设定移动两次之间的延迟时间,数值越大越有跳跃感。
loop:用于设定移动的次数,不设置该值则为无限循环
style="font-size: "用于设定文字大小。
wline-htight: 用于设定文字行间距。
font-family: 用于设定字体。
<marquee>标记的默认情况是向左移动无限次,字幕高度是
文本高度,移动范围:水平移动的宽度是当前位
置的宽度,垂直移动的高度是当前位置的高度。
字体是从右向左移动,鼠标放上面停止移动,松开继续。
<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var ostat = false;
function scrollstop() {
news.scrollAmount = 0;
ostat = true;
}
function scrollplay() {
news.scrollAmount = 5;
ostat = false;
}
function scrolldir() {
mid = screen.width / 2;
mouse = event.x;
if(mouse > mid) {
if(ostat == false) {
speed = (mouse - mid) / 25;
news.scrollAmount = speed;
}
news.direction = "right";
}
else {
if(ostat == false) {
speed = (mid - mouse) / 25;
news.scrollAmount = speed;
}
news.direction = "left";
}
}
// End -->
</script>




<head/>
<body>
<marquee name=news id=news behavior=scroll direction=left scrollamount=5 scrolldelay=1 hspace=0 vspace=0 onMouseOver="scrollstop()" onMouseOut="scrollplay()" >
<b>Welcome To Typhoon Start JavaScript Fairyland!</b>
</marquee>


</body>
</html>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值