この記事では、JSの水平ブラインド効果のWebページのアニメーション効果を切り替える方法について説明します。参照のためにそれを共有してください。特定の分析は次のとおりです。
これは非常にシンプルだが良いWebページの切り替え効果です。新しいWebページをクリックした後、Webページは、すべてのWebページが完全に表示されるまで青と白のブラインドを自動的に切り替えます。コードは次のとおりです。
次のようにコードをコピーします:<html>
<head>
<Title> JS Webブラインドダイナミックスイッチング効果</title>
<style>
<! -
.intro {
位置:絶対;
左:0;
上:0;
レイヤーバックグラウンドカラー:青。
背景色:青;
ボーダー:0.1pxソリッドブルー
}
- >
</style>
</head>
<body>
<div id = "i1"> </div> <div id = "i2"> </div> <div id = "i3"
class = "intro"> </div> <div id = "i4"> </div> <div id = "i5"> </div> <div> <div
id = "i6"> </div> <div id = "i7"> </div> <div id = "i8"> </div>
<スクリプト言語= "javascript1.2">
var速度= 20
var temp = new array()
var temp2 = new array()
if(document.layers){
for(i = 1; i <= 8; i ++){
temp [i] = eval( "document.i"+i+"。クリップ")
temp2 [i] = eval( "document.i"+i)
temp [i] .width = window.innerwidth
temp [i] .height = window.innerheight/8
temp2 [i] .top =(i-1)*temp [i] .height
}
}
else if(document.all){
var Clipright = document.body.clientwidth、clift = 0
for(i = 1; i <= 8; i ++){
temp [i] = eval( "document.all.i"+i+"。スタイル")
temp [i] .width = document.body.clientWidth
temp [i] .height = document.body.offsetheight/8
temp [i] .top =(i-1)*parseint(temp [i] .height)
}
}
function openit(){
window.scrollto(0,0)
if(document.layers){
for(i = 1; i <= 8; i = i+2)
temp [i] .right- =速度
for(i = 2; i <= 8; i = i+2)
temp [i] .left+=速度
if(temp [2] .left> window.innerwidth)
ClearInterval(stopit)
}
else if(document.all){
Clipright- =速度
for(i = 1; i <= 8; i = i+2){
temp [i] .clip = "rect(0"+clipright+"auto 0)"
}
clipleft+=速度
for(i = 2; i <= 8; i = i+2){
temp [i] .clip = "rect(0 auto auto"+clipleft+")"
}
if(clipright <= 0)
ClearInterval(stopit)
}
}
function gogo(){
stopit = setInterval( "openit()"、100)
}
ゴーゴー()
</script>
</body>
</html>
この記事がみんなのJavaScriptプログラミングに役立つことを願っています。