其實這效果用css3的animation就能辦到，不過這裡就當熟悉js的操作吧！
效果圖如下：
html部分：
<.box這層div可以不用加，這裡只是作為子絕父相的父元素罷了！當然，把遊覽器作為父元素也可以，只是想鑲嵌到其他div中就麻煩了。div
class
="box"
>
<
div
id="shengjiang"
>
<
p><
span
color
="#ff0"
>一行文字
span
>
p>
div>
div>
css部分：
*.box#shengjiang如果是css3，就直接換成以下的就好了。
*.box#shengjiang@keyframes mymoveanimation，css3的動畫屬性50% 100%}
mymove 定義的名稱，可自定義。
5s 一次需要的時間
infinite 迴圈反覆
@keyframes mymove 給上面定義的名稱新增動畫屬性。
即0%時所在位置，50%時所在位置，100%時所在位置。
0-100%之間可任意分隔。
top 是從0到200px再回到0；
js部分，雖說到這裡就已經達成效果了說……
var step = 4;function anim(x,y)
if (x<0)
settimeout('anim('+(x+step)+','+y+')', 35); //
等待多少秒執行，所以數值越小速度就越快//}
anim(5,200);//
5只是初始位置，200才是整體的高度，至於如何確認最頂端，還要看if (x<0) 中的x<0中的0這個數值。
js文字從左邊飛入效果
貼 之前，我們先講一下它的原理，我們使用setinterval，讓文字一開始置於螢幕看不到的位置，左右上下都可以，然後讓它的位置不斷移入到螢幕看得到的位置。下面上 html js if document.getelementbyid document.all var crossheader docu...
JS小案例 文字切換效果
下面是乙個文字切換效果的小案例，希望可以可以幫助到有需要的小夥伴 lang en charset utf 8 name viewport content width device width,initial scale 1.0 文字切換效果title head container style spe...
js實現逐字列印效果，文字逐字顯示
本文介紹的是利用js實現文字逐步顯示的效果，簡單的說，就是文字乙個字乙個字的顯示出來，就像列印一樣。doctype html html head title js實現逐字列印效果，文字逐字顯示 title style type text css body text style head body p...