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 相关文章推荐
悄悄用脚本检查你访问过哪些网站的代码
Dec 04 Javascript
jquery实现ajax提交form表单的方法总结
Mar 03 Javascript
js中匿名函数的创建与调用方法分析
Dec 19 Javascript
jQuery的remove()方法使用详解
Aug 11 Javascript
JS+CSS实现的经典圆角下拉菜单效果代码
Oct 21 Javascript
微信小程序 MINA文件结构
Oct 17 Javascript
用JavaScript实现让浏览器停止载入页面的方法
Jan 19 Javascript
JavaScript使用原型和原型链实现对象继承的方法详解
Apr 05 Javascript
javascript实现日期三级联动下拉框选择菜单
Dec 03 Javascript
基于JQuery的Ajax方法使用详解
Aug 16 jQuery
vue2 设置router-view默认路径的实例
Sep 20 Javascript
JavaScript实现旋转木马轮播图
Mar 16 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去掉从word直接粘贴过来的没有用格式的函数
2012/10/29 PHP
在PHP中输出JS语句以及乱码问题的解决方案
2019/02/13 PHP
PHP数据源架构模式之表入口模式实例分析
2020/01/23 PHP
响应鼠标变换表格背景或者颜色的代码
2009/03/30 Javascript
简短几句jquery代码的实现一个图片向上滚动切换
2011/09/02 Javascript
javascript小数四舍五入多种方法实现
2012/12/23 Javascript
AngularJS语法详解
2015/01/23 Javascript
angular2使用简单介绍
2016/03/01 Javascript
一个简单不报错的summernote 图片上传案例
2016/07/11 Javascript
jQuery实现Select下拉列表进行状态选择功能
2017/03/30 jQuery
jquery dataTable 后台加载数据并分页实例代码
2017/06/07 jQuery
React教程之Props验证的具体用法(Props Validation)
2017/09/04 Javascript
react实现一个优雅的图片占位模块组件详解
2017/10/30 Javascript
利用Javascript实现一套自定义事件机制
2017/12/14 Javascript
基于React+Redux的SSR实现方法
2018/07/03 Javascript
详解Angular如何正确的操作DOM
2018/07/06 Javascript
微信小程序文章详情页面实现代码
2018/09/10 Javascript
详解vue-video-player使用心得(兼容m3u8)
2019/08/23 Javascript
javascript操作元素的常见方法小结
2019/11/13 Javascript
[03:16]DOTA2完美大师赛小组赛精彩集锦
2017/11/22 DOTA
决策树的python实现方法
2014/11/18 Python
Python的GUI框架PySide的安装配置教程
2016/02/16 Python
python如何获取服务器硬件信息
2017/05/11 Python
基于Python实现剪切板实时监控方法解析
2019/09/11 Python
Python+unittest+requests+excel实现接口自动化测试框架
2020/12/23 Python
Hotels.com香港酒店网:你的自由行酒店订房专家
2018/01/22 全球购物
入党自我评价范文
2014/02/02 职场文书
各营销点岗位职责范本
2014/03/05 职场文书
校庆接待方案
2014/03/18 职场文书
综治维稳工作承诺书
2014/08/30 职场文书
公安机关正风肃纪剖析材料
2014/10/10 职场文书
2014年销售助理工作总结
2014/12/01 职场文书
mysql5.7使用binlog 恢复数据的方法
2021/06/03 MySQL
Oracle11g R2 安装教程完整版
2021/06/04 Oracle
python前后端自定义分页器
2022/04/13 Python