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 相关文章推荐
Dom在ajax技术中的作用说明
Oct 25 Javascript
javascript表单验证 - Parsley.js使用和配置
Jan 25 Javascript
JQuery.get提交页面不跳转的解决方法
Jan 13 Javascript
JS清除选择内容的方法
Jan 29 Javascript
js简易版购物车功能
Jun 17 Javascript
webpack3之loader全解析
Oct 26 Javascript
vue中如何创建多个ueditor实例教程
Nov 14 Javascript
使用vux实现上拉刷新功能遇到的坑
Feb 08 Javascript
使用vue-aplayer插件时出现的问题的解决
Mar 02 Javascript
vue element upload实现图片本地预览
Aug 20 Javascript
VScode格式化ESlint方法(最全最好用方法)
Sep 10 Javascript
BootStrap前端框架使用方法详解
Feb 26 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_screw 1.5:php加密: 安装与使用详解
2013/06/20 PHP
php封装的mongodb操作类代码
2017/08/06 PHP
PHP面向对象程序设计模拟一般面向对象语言中的方法重载(overload)示例
2019/06/13 PHP
javascript不同类型数据之间的运算的转换方法
2014/02/13 Javascript
jquery通过load获取文件的内容并跳到锚点的方法
2015/01/29 Javascript
Javascript中的arguments与重载介绍
2015/03/15 Javascript
AngularJS实现Model缓存的方式
2016/02/03 Javascript
超全面的javascript中变量命名规则
2017/02/09 Javascript
Angular 2 利用Router事件和Title实现动态页面标题的方法
2017/08/23 Javascript
VueJS事件处理器v-on的使用方法
2017/09/27 Javascript
Vue 2.0学习笔记之Vue中的computed属性
2017/10/16 Javascript
Node.js成为Web应用开发最佳选择的原因
2018/02/05 Javascript
微信小程序生成二维码的示例代码
2019/03/29 Javascript
JavaScript函数式编程(Functional Programming)纯函数用法分析
2019/05/22 Javascript
在react中使用vue的状态管理的方法示例
2020/05/02 Javascript
JavaScript实现原型封装轮播图
2020/12/27 Javascript
[04:44]DOTA2 2017全国高校联赛视频回顾
2017/08/21 DOTA
[59:36]2018DOTA2亚洲邀请赛 4.3 突围赛 Secret vs VG 第二场
2018/04/04 DOTA
使用Python的Treq on Twisted来进行HTTP压力测试
2015/04/16 Python
python使用Turtle库绘制动态钟表
2018/11/19 Python
对YOLOv3模型调用时候的python接口详解
2019/08/26 Python
基于python全局设置id 自动化测试元素定位过程解析
2019/09/04 Python
python scipy卷积运算的实现方法
2019/09/16 Python
Python(PyS60)实现简单语音整点报时
2019/11/18 Python
python接口自动化之ConfigParser配置文件的使用详解
2020/08/03 Python
Python 整行读取文本方法并去掉readlines换行\n操作
2020/09/03 Python
python操作链表的示例代码
2020/09/27 Python
美国美发品牌:Bumble and Bumble
2016/10/08 全球购物
美国克罗格超市在线购物:Kroger
2019/06/21 全球购物
酒店拾金不昧表扬信
2014/01/18 职场文书
2014年秋季开学演讲稿
2014/05/24 职场文书
电气工程及其自动化专业毕业生自荐信
2014/06/21 职场文书
自查自纠工作总结
2014/10/15 职场文书
2016入党积极分子考察评语
2015/12/01 职场文书
解决Jupyter-notebook不弹出默认浏览器的问题
2021/03/30 Python
Java实现超大Excel文件解析(XSSF,SXSSF,easyExcel)
2022/07/15 Java/Android