DHTML Slide Show script图片轮换


Posted in Javascript onMarch 03, 2008

步骤 1: 将下面代码加到 <head> 标签内:

<script type="text/javascript">   
/***********************************************    
* DHTML slideshow script-  © Dynamic Drive DHTML code library (www.dynamicdrive.com)    
* This notice must stay intact for legal use    
* Visit http://www.dynamicdrive.com/ for full source code    
***********************************************/    
var photos=new Array()    
var photoslink=new Array()    
var which=0   
//define images. You can have as many as you want:    
photos[0]="photo1.jpg"    
photos[1]="photo2.jpg"    
photos[2]="photo3.jpg"    
//Specify whether images should be linked or not (1=linked)    
var linkornot=0   
//Set corresponding URLs for above images. Define ONLY if variable linkornot equals "1"    
photoslink[0]=""    
photoslink[1]=""    
photoslink[2]=""    
//do NOT edit pass this line    
var preloadedimages=new Array()    
for (i=0;i<photos.length;i++){    
preloadedimages[i]=new Image()    
preloadedimages[i].src=photos[i]    
}    
function applyeffect(){    
if (document.all && photoslider.filters){    
photoslider.filters.revealTrans.Transition=Math.floor(Math.random()*23)    
photoslider.filters.revealTrans.stop()    
photoslider.filters.revealTrans.apply()    
}    
}    
function playeffect(){    
if (document.all && photoslider.filters)    
photoslider.filters.revealTrans.play()    
}    
function keeptrack(){    
window.status="Image "+(which+1)+" of "+photos.length    
}    
function backward(){    
if (which>0){    
which--    
applyeffect()    
document.images.photoslider.src=photos[which]    
playeffect()    
keeptrack()    
}    
}    
function forward(){    
if (which<photos.length-1){    
which++    
applyeffect()    
document.images.photoslider.src=photos[which]    
playeffect()    
keeptrack()    
}    
}    
function transport(){    
window.location=photoslink[which]    
}    
</script>  

步骤 2: 将下面代码加到需要的地方:
<table border="0" cellspacing="0" cellpadding="0">   
<tr>   
<td width="100%" colspan="2" height="22"><center>   
<script>   
if (linkornot==1)    
document.write('<a href="javascript:transport()">')    
document.write('<img src="'+photos[0]+'" name="photoslider" style="filter:revealTrans(duration=2,transition=23)" border=0>')    
if (linkornot==1)    
document.write('</a>')    
</script>   
</center></td>   
</tr>   
<tr>   
<td width="50%" height="21"><p align="left"><a href="#" onClick="backward();return false">Previous Slide</a></td>   
<td width="50%" height="21"><p align="right"><a href="#" onClick="forward();return false">Next Slide</a></td>   
</tr>   
</table>   
<p align="center"><font face="Arial" size="-2">Free DHTML scripts provided by<br>   
<a href="http://dynamicdrive.com">Dynamic Drive</a></font></p> 
Javascript 相关文章推荐
JavaScript While 循环基础教程
Apr 05 Javascript
jquery创建一个新的节点对象(自定义结构/内容)的好方法
Jan 21 Javascript
jQuery设置与获取HTML,文本和值的简单实例
Feb 26 Javascript
JS二维数组的定义说明
Mar 03 Javascript
基于Bootstrap的Metronic框架实现条码和二维码的生成及打印处理操作
Aug 29 Javascript
jQuery 遍历map()方法详解
Nov 04 Javascript
Vue仿今日头条实例详解
Feb 06 Javascript
在vue里面设置全局变量或数据的方法
Mar 09 Javascript
详解extract-text-webpack-plugin 的使用及安装
Jun 12 Javascript
分享vue里swiper的一些坑
Aug 30 Javascript
JavaScript禁用右键单击优缺点分析
Jan 20 Javascript
解决vue.js提交数组时出现数组下标的问题
Nov 05 Javascript
JavaScript面向对象编程
Mar 02 #Javascript
一个javascript参数的小问题
Mar 02 #Javascript
js加解密 脚本解密
Feb 22 #Javascript
JS应用之禁止抓屏、复制、打印
Feb 21 #Javascript
js 调整select 位置的函数
Feb 21 #Javascript
js 替换
Feb 19 #Javascript
javascript replace方法与正则表达式
Feb 19 #Javascript
You might like
php防盗链的常用方法小结
2010/07/02 PHP
php将图片保存入mysql数据库失败的解决方法
2014/12/27 PHP
php curl 上传文件代码实例
2015/04/27 PHP
PHP常用函数之格式化时间操作示例
2019/10/21 PHP
php使用gearman进行任务分发操作实例详解
2020/02/26 PHP
基于jquery的表格排序
2010/09/11 Javascript
jquery等待效果示例
2014/05/01 Javascript
JS实现图片无间断滚动代码汇总
2014/07/30 Javascript
jquery简单实现带渐显效果的选项卡菜单代码
2015/09/01 Javascript
jQuery实现响应鼠标滚动的动感菜单效果
2015/09/21 Javascript
jQuery实现的倒计时效果实例小结
2016/04/16 Javascript
基于jQuery和hwSlider实现内容左右滑动切换效果附源码下载(一)
2016/06/22 Javascript
js实现仿购物车加减效果
2017/03/01 Javascript
微信小程序中使用javascript 回调函数
2017/05/11 Javascript
JS实现给json数组动态赋值的方法示例
2020/03/19 Javascript
在vue中实现简单页面逆传值的方法
2017/11/27 Javascript
简单两步使用node发送qq邮件的方法
2019/03/01 Javascript
JavaScript中BOM对象原理与用法分析
2019/07/09 Javascript
Vue Object.defineProperty及ProxyVue实现双向数据绑定
2020/09/02 Javascript
Vue中使用JsonView来展示Json树的实例代码
2020/11/16 Javascript
Python利用正则表达式匹配并截取指定子串及去重的方法
2015/07/30 Python
Python简明入门教程
2015/08/04 Python
python在Windows下安装setuptools(easy_install工具)步骤详解
2016/07/01 Python
Python实现网站注册验证码生成类
2017/06/08 Python
浅谈Python用QQ邮箱发送邮件时授权码的问题
2018/01/29 Python
python使用筛选法计算小于给定数字的所有素数
2018/03/19 Python
Scrapy-Redis结合POST请求获取数据的方法示例
2019/05/07 Python
使用python判断jpeg图片的完整性实例
2019/06/10 Python
解决tensorflow由于未初始化变量而导致的错误问题
2020/01/06 Python
python开发一个解析protobuf文件的简单编译器
2020/11/17 Python
让IE可以变相支持CSS3选择器
2010/01/21 HTML / CSS
Myprotein西班牙官网:欧洲第一大运动营养品牌
2020/02/24 全球购物
生产车间主管岗位职责
2013/12/28 职场文书
协商一致解除劳动合同协议书
2014/09/14 职场文书
2015年话务员工作总结
2015/04/29 职场文书
Window server 2012 R2 AD域的组策略相关设置
2022/04/28 Servers