左右可控的JS图片幻灯_图片特效特效

从老外那里整理出来的，优化了部分JavaScript代码，图片地址及文字描述都写在JS的数组里，因此适合一些不经常更新的页面，因为将地址及信息写进数组，对动态更新造成一定麻烦，用到的可关注一下。

<html>
<head>
<title>左右可控的图片幻灯</title>
<style> 
.Caption {
font-family: Arial;
font-weight: normal;
font-size:  12pt;
color:      #FF3300; }
 
A.Controls:link    { color:#666666;
                     text-decoration:none;
                     font-family: Arial;
                     font-size:   14pt;
                     font-weight: bold; }
A.Controls:visited { color:#666666; text-decoration:none; 
                     font-family: Arial;
                     font-size:   14pt;
                     font-weight: bold; }
A.Controls:active  { color:#666666; text-decoration:none;
                     font-family: Arial;
                     font-size:   14pt;
                     font-weight: bold; }
A.Controls:hover   { color:#00FF00; text-decoration:none;
                     font-family: Arial;
                     font-size:   14pt;
                     font-weight: bold; }
 
</style>
<script> 
var SlideShowSpeed = 3000;
var CrossFadeDuration = 2;
 
var Picture = new Array(); 
var Caption = new Array();
var showHot = false;
Picture[1]  = '/jscss/demoimg/wall1.jpg';
Picture[2]  = '/jscss/demoimg/wall2.jpg';
Picture[3]  = '/jscss/demoimg/wall3.jpg';

Caption[1]  = "迷人的草原.";
Caption[2]  = "好美的景色哦.";
Caption[3]  = "我爱大自然.";

var tss;
var iss;
var jss = 0;
var pss = Picture.length-1;
 
var preLoad = new Array();
for (iss = 1; iss < pss+1; iss++){
preLoad[iss] = new Image();
preLoad[iss].src = Picture[iss];}
 
function control(how){
if (showHot){
if (how=="H") jss = 1;
if (how=="F") jss = jss + 1;
if (how=="B") jss = jss - 1;
if (jss > (pss)) jss=1;
if (jss < 1) jss = pss;
if (document.all){
document.images.PictureBox.style.filter="blendTrans(duration=2)";
document.images.PictureBox.style.filter="blendTrans(duration=CrossFadeDuration)";
document.images.PictureBox.filters.blendTrans.Apply();}
document.images.PictureBox.src = preLoad[jss].src;
if (document.getElementById) document.getElementById("CaptionBox").innerHTML= Caption[jss];
if (document.all) document.images.PictureBox.filters.blendTrans.Play();
}}
 
</script>
 
</head> 
<body onload='showHot=true;self.focus();' bgcolor=#000000 link="#FF0000" vlink="#FF0000" alink="#FF0000">
<div align="center">
  <center>
<table border=0 cellpadding=10 cellspacing=0>
  <tr>

<td width=350 height=280 colspan="3">
    <img src=http://p1.mb5u.com/texiao/20110225160453209.jpg name=PictureBox width=350 height=280>
    </td>
  </tr>
  <tr>
    <td id=CaptionBox class=Caption align=center colspan="3">这是最开始时候的默认第一张。</td>
  </tr>
  <tr>
    <td align="center">
    <a class=Controls href="#" onClick="javascript:control('B');">< <</a>
    </td>
    <td align="center">
    <a class=Controls href="#" onClick="javascript:control('H');">| | |</a>
    </td>
    <td align="center">
    <a class=Controls href="#" onClick="javascript:control('F');"><b>> ></b></a>
    </td>
  </tr>  
</table>
  </center>
</div>
</body>
</html>

所属频道：图片特效特效/更新时间：2012-12-07

[收藏][报错][返回列表]

左右可控的JS图片幻灯_图片特效特效

图片特效特效Rss订阅特效代码搜索

图片特效特效推荐

猜你也喜欢看这些