网页轮显幻灯片 php,图片轮显代码大全(JS幻灯片)

透明渐变轮番显示

点 击 预 览 效 果 页 面......

图片以透明渐变轮番显示的脚本效果,过去也有过类似的,可是

不能任意的定制增减图片的数量,这次的是完美的。

制作方法:

标签下,粘贴代码:

// 设置轮番显示速度 Set slideShowSpeed (milliseconds)

var slideShowSpeed = 5000;

// 匀滑转换时间 Duration of crossfade (seconds)

var crossFadeDuration = 3;

// 指定图像文件 Specify the image files

var Pic = new Array();

// to add more images, just continue

// the pattern, adding to the array below

Pic[0] = ‘1.jpg‘

Pic[1] = ‘2.jpg‘

Pic[2] = ‘3.jpg‘

Pic[3] = ‘4.jpg‘

Pic[4] = ‘5.jpg‘

// do not edit anything below this line

var t;

var j = 0;

var p = Pic.length;

var preLoad = new Array();

for (i = 0; i < p; i++) {

preLoad = new Image();

preLoad.src = Pic;

}

function runSlideShow() {

if (document.all) {

document.images.SlideShow.style.filter="blendTrans(duration=2)";

document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)";

document.images.SlideShow.filters.blendTrans.Apply();

}

document.images.SlideShow.src = preLoad[j].src;

if (document.all) {

document.images.SlideShow.filters.blendTrans.Play();

}

j = j + 1;

if (j > (p - 1)) j = 0;

t = setTimeout(‘runSlideShow()‘, slideShowSpeed);

}

修改body:

将表格单元格设置名称“id=VU”:

  在中加入代码:1.jpg

至此,我们的效果便制作好了,你不仿试试!

点 击 预 览 效 果 页 面......

制作方法:

1. 在

中插入代码:

isns = navigator.appName == "Netscape";

//定义播放图片张数

img1=new Image()

img2=new Image()

img3=new Image()

img4=new Image()

img5=new Image()

//图片路径、文件名

img1.src=‘images/circul-side.gif‘

img2.src=‘images/css-manual.gif‘

img3.src=‘images/kpt7.jpg‘

img4.src=‘images/msn.jpg‘

img5.src=‘images/ps-}

else

document.pic.visibility=‘visible‘

tt=setTimeout(‘change_img()‘,4000)

}

可以在代码中按照中文介绍,修改相关信息。

2. 在

中加载:

3. 插入第一张图片,并命名:id="pic"

插入代码:style=‘visibility:hidden;filter:revealtrans(duration=2.0,transition=12)‘

参考图片代码:

  circul-side.gif

制作完成。

观看效果

使用CSS中的revealTrans滤镜制作超弦图片的播放

CSS中有revealTrans滤镜(具体介绍请参看巧用CSS的 RevealTrans 滤镜),也曾用该滤镜制作过各种图片播放的效果(类似于使用CSS滤镜revealTrans制作图片渐显效果)。知道其在网页中制作特效非常有用处。这次,我们准备介绍另一种使用revealTrans滤镜制作出超弦图片播放的效果。

实现思路:使用revealTrans滤镜制作出超弦图片播放的效果,并每张图片有各自的链接地址。

制作方法:

1、在

中插入JS代码:

function reapply(){

setTimeout("slideit()",800)

return true

}

window.οnerrοr=reapply

  其中:images/big完整代码:circul-side.gif

4、给图片加超链接:

5、加入代码:

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值