根据网友<
VBscript超强幻灯片效果代码>改写而来:).
因为我发现将VBS用在网页中时, 如果再调用JS代码会出现莫名其妙的错误,但是网页中全用JS代码后就不出现错误了,所以把网友的VBS改成了JS.
slide.js源代码:
//
超强幻灯片效果
var
temp_arr1
=
navigator.appVersion.split(
"
;
"
)
var
temp_arr2
=
temp_arr1[
1
].split(
"
"
)
var
CanPlay
=
( temp_arr2[
2
]
>
5
)
var
FilterStr
=
"
RevealTrans(duration=2,transition=23)
"
FilterStr
=
FilterStr
+
"
;BlendTrans(duration=2)
"
if
(CanPlay)
{
FilterStr = FilterStr + ";progid:DXImageTransform.Microsoft.Pixelate(,enabled=false,duration=2,maxSquare=25)"
FilterStr = FilterStr + ";progid:DXImageTransform.Microsoft.Fade(duration=2,overlap=0)"
FilterStr = FilterStr + ";progid:DXImageTransform.Microsoft.GradientWipe(duration=2,gradientSize=0.25,motion=forward )"
FilterStr = FilterStr + ";progid:DXImageTransform.Microsoft.Stretch(duration=2,stretchStyle=PUSH)"
FilterStr = FilterStr + ";progid:DXImageTransform.Microsoft.Wheel(duration=2,spokes=16)"
FilterStr = FilterStr + ";progid:DXImageTransform.Microsoft.RandomDissolve(duration=2)"
FilterStr = FilterStr + ";progid:DXImageTransform.Microsoft.Spiral(duration=2,gridSizeX=50,gridSizeY=50)"
FilterStr = FilterStr + ";progid:DXImageTransform.Microsoft.Slide(duration=2,bands=1,slideStyle=SWAP)"
FilterStr = FilterStr + ";progid:DXImageTransform.Microsoft.RadialWipe(duration=2,wipeStyle=CLOCK)"
}
else
alert(
"
幻灯片图片切换效果需要浏览器为IE5.5或以上版本，否则将只能看到部分的切换效果。
"
)
var
FilterArr
=
FilterStr.split(
"
;
"
)
var
PlayImg_M
=
5
*
1000
//
切换时间（毫秒）
var
I
=
1
function
ChangeImg(FileListArr)
{
while(FileListArr[I]=="")
{
I = I + 1
if (I >= FileListArr.length) I = 0;
}
var J
if (I >= FileListArr.length) I = 0;
//Randomize //随机数
J = Math.round( Math.random() * 100 ) % FilterArr.length
Img.style.filter = FilterArr[J]
Img.filters(0).apply()
Img.src = FileListArr[I]
Img.filters(0).play()
I = I + 1
if (I >= FileListArr.length) I = 0;
TempImg.src = FileListArr[I]
window.setTimeout("ChangeImg(FileListArr)",PlayImg_M)
}
//
'''''''''''''''''''''''''''''''''''''''''
function
ShowImg(FileList)
{
FileListArr = FileList.split(",")
NoScript.style.display = "none"
CanRunScript.style.display = ""
Img.src = FileListArr[0]
Img.style.width = "990"
Img.style.height = "100"
window.setTimeout("ChangeImg(FileListArr)", PlayImg_M)
}
在网页中调用的代码:
<!--
在网页中调用js幻灯片效果
-->
<
table
width
="990px"
align
="center"
border
="0px"
cellpadding
="0px"
cellspacing
="0px"
>
<
tr
id
="NoScript"
>
<
td
align
="center"
style
="color:white"
>
对不起，您的浏览器禁止脚本运行，无法正常显示图片。
</
td
>
</
tr
>
<
tr
style
="display:none"
id
="CanRunScript"
>
<
td
height
="100%"
align
="center"
valign
="middle"
>
<
img
ID
="Img"
border
="0"
>
</
td
>
</
tr
>
<
tr
style
="display:none"
>
<
TD
><
Img
ID
="TempImg"
Border
="0"
></
TD
>
</
tr
>
</
table
>
<
script
type
="text/javascript"
src
="../js/slide.js"
></
script
>
<
script
language
="javascript"
>
FileList = "../images/top_banner_1.jpg";
FileList = FileList + ",../images/top_banner_2.jpg";//多张图片用逗号隔开
ShowImg(FileList);
</
script
>
因为我发现将VBS用在网页中时, 如果再调用JS代码会出现莫名其妙的错误,但是网页中全用JS代码后就不出现错误了,所以把网友的VBS改成了JS.
slide.js源代码:
//
超强幻灯片效果
var
temp_arr1
=
navigator.appVersion.split(
"
;
"
)
var
temp_arr2
=
temp_arr1[
1
].split(
"
"
)
var
CanPlay
=
( temp_arr2[
2
]
>
5
)
var
FilterStr
=
"
RevealTrans(duration=2,transition=23)
"
FilterStr
=
FilterStr
+
"
;BlendTrans(duration=2)
"
if
(CanPlay)
{
FilterStr = FilterStr + ";progid:DXImageTransform.Microsoft.Pixelate(,enabled=false,duration=2,maxSquare=25)" FilterStr = FilterStr + ";progid:DXImageTransform.Microsoft.Fade(duration=2,overlap=0)" FilterStr = FilterStr + ";progid:DXImageTransform.Microsoft.GradientWipe(duration=2,gradientSize=0.25,motion=forward )" FilterStr = FilterStr + ";progid:DXImageTransform.Microsoft.Stretch(duration=2,stretchStyle=PUSH)" FilterStr = FilterStr + ";progid:DXImageTransform.Microsoft.Wheel(duration=2,spokes=16)" FilterStr = FilterStr + ";progid:DXImageTransform.Microsoft.RandomDissolve(duration=2)" FilterStr = FilterStr + ";progid:DXImageTransform.Microsoft.Spiral(duration=2,gridSizeX=50,gridSizeY=50)" FilterStr = FilterStr + ";progid:DXImageTransform.Microsoft.Slide(duration=2,bands=1,slideStyle=SWAP)" FilterStr = FilterStr + ";progid:DXImageTransform.Microsoft.RadialWipe(duration=2,wipeStyle=CLOCK)" }
else
alert(
"
幻灯片图片切换效果需要浏览器为IE5.5或以上版本，否则将只能看到部分的切换效果。
"
)
var
FilterArr
=
FilterStr.split(
"
;
"
)
var
PlayImg_M
=
5
*
1000
//
切换时间（毫秒）
var
I
=
1
function
ChangeImg(FileListArr)
{ while(FileListArr[I]=="") { I = I + 1 if (I >= FileListArr.length) I = 0; } var J if (I >= FileListArr.length) I = 0; //Randomize //随机数 J = Math.round( Math.random() * 100 ) % FilterArr.length Img.style.filter = FilterArr[J] Img.filters(0).apply() Img.src = FileListArr[I] Img.filters(0).play() I = I + 1 if (I >= FileListArr.length) I = 0; TempImg.src = FileListArr[I] window.setTimeout("ChangeImg(FileListArr)",PlayImg_M) }
//
'''''''''''''''''''''''''''''''''''''''''
function
ShowImg(FileList)
{ FileListArr = FileList.split(",") NoScript.style.display = "none" CanRunScript.style.display = "" Img.src = FileListArr[0] Img.style.width = "990" Img.style.height = "100" window.setTimeout("ChangeImg(FileListArr)", PlayImg_M) }
在网页中调用的代码:
<!--
在网页中调用js幻灯片效果
-->
<
table
width
="990px"
align
="center"
border
="0px"
cellpadding
="0px"
cellspacing
="0px"
>
<
tr
id
="NoScript"
>
<
td
align
="center"
style
="color:white"
>
对不起，您的浏览器禁止脚本运行，无法正常显示图片。
</
td
>
</
tr
>
<
tr
style
="display:none"
id
="CanRunScript"
>
<
td
height
="100%"
align
="center"
valign
="middle"
>
<
img
ID
="Img"
border
="0"
>
</
td
>
</
tr
>
<
tr
style
="display:none"
>
<
TD
><
Img
ID
="TempImg"
Border
="0"
></
TD
>
</
tr
>
</
table
>
<
script
type
="text/javascript"
src
="../js/slide.js"
></
script
>
<
script
language
="javascript"
>
FileList = "../images/top_banner_1.jpg"; FileList = FileList + ",../images/top_banner_2.jpg";//多张图片用逗号隔开 ShowImg(FileList);
</
script
>
