效果图:

源程序:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<HTML XMLns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/HTML; charset=gb2312" />
<meta http-equiv="expires" content="0">
<title>JavaScript幻灯片效果</title>
<style type="text/CSS">
<!--
body { font-size:12px;
}
input {
border-right: #7b9ebd 1px solid;
padding-right: 2px;
border-top: #7b9ebd 1px solid;
padding-left: 2px;
font-size: 12px;
filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#cecfde);
border-left: #7b9ebd 1px solid;
cursor: hand;
color: black;
padding-top: 2px;
border-bottom: #7b9ebd 1px solid;
}
.img {
filter:alpha(opacity=1,enabled=1) blendtrans(duration=1);
border:1px solid #CCCCCC;
}
-->
</style>
<script language="JavaScript">
var l=0;
var sum=0;
var _c = 0;
var _i = 0;
var _v = 0;
var _l = 0;
var _fi = 0;
var _sf = 3000;
var _HTML = null;
var _image = null;
var _mycars= new Array();
var _w = new Array();
var _h = new Array();
var imgs=new Array();
var limg=new Array();
/* 渐隐渐现 */
function transImg(enable){
document.getElementById("showimg").filters.blendtrans.Apply();
document.getElementById("showimg").filters[0].enabled=enable;
document.getElementById("showimg").filters.blendtrans.Play();
}
/* 加载图片 */
function chk(){
l--;
document.getElementById("rotatorPlayer").innerHTML='<img src='+limg[0].src+'><br><br>' + '照片已加载:' + parseInt(((sum-
l)*100/sum)).toString() + '%'
if (l==0){
adRotator.play();
document.getElementById('stops').disabled='';
document.getElementById('next').disabled='';
}
}
if (document.images){
limg[0]=new Image();
limg[0].src="loading.gif";
for(var i=0;i<13;i++)
{
imgs[i]=new Image();
imgs[i].src=parseInt(i+1)+".jpg";
}
}
function adRotator() {}
function adRotator.add(p,w,h)
{
_mycars[_c] = p;
_w[_c] = w;
_h[_c] = h;
_c = _c + 1;
}
/* 播放设置 */
function adRotator.loads()
{
if (_i < _mycars.length && _l < 1)
{
_HTML = '<img id="showimg" src="' + _mycars[_i] + '" width="' + _w[_i] + '" height="' + _h[_i] + '" class="img">'
if (_v < 1)
{
document.getElementById('image').value = _HTML + ',' + _i;
document.getElementById('rotatorPlayer').innerHTML = _HTML;
transImg(0);
_i = _i + 1;
document.getElementById('backs').disabled='';
transImg(1);
transImg(0);
window.setTimeout("adRotator.loads("+_i+")",_sf);
}
}
else
{
_HTML = '<img id="showimg" src="' + _mycars[_i] + '" width="' + _w[_i] + '" height="' + _h[_i] + '" class="img">'
document.getElementById('image').value = _HTML + ',' + _i;
document.getElementById('rotatorPlayer').innerHTML = _HTML;
transImg(0);
transImg(1);
transImg(0);
}
if (_i+1 > _mycars.length)
{
document.getElementById('stops').disabled='True';
document.getElementById('play').disabled='';
document.getElementById('backs').disabled='';
document.getElementById('next').disabled='True';
_i = 0;
_v = 1;
}
}
/* 播放 */
function adRotator.play()
{
_v = 0;
_l = 0;
adRotator.loads();
}
/* 下一张 */
function adRotator.next()
{
_l = 1;
if(_i+1 < _mycars.length)
{
_i = _i + 1;
document.getElementById('play').disabled='';
document.getElementById('stops').disabled='True';
document.getElementById('backs').disabled='';
adRotator.loads();
如果您对本文有任何疑问或者建议,请到讨论区发表您的意见:
>>
论坛入口 <<
上一篇:
Javascript函数 判断数字的合法性 下一篇:
怎么样去掉flash激活提示
【文章评论】
【收藏本文】
【推荐好友】
【打印本文】
【我要投稿】 【论坛讨论】