• 文字广告位
  • 文字广告位
  • 文字广告位
您现在的位置: 站长手册 >> 特效代码 >> 图片类 >> 正文
站内搜索
Google
[图文]完善的图片的幻灯显示
      ★★★★★   

完善的图片的幻灯显示

雅虎收藏夹 百度收藏 Google书签 Yahoo书签 新浪ViVi 搜狐网摘 365Key网摘 天极网摘 diglog 和讯网摘 POCO网摘 YouNote网摘 博拉网 天下图摘 Del.icio.us digg reddit spurl BlinkList blogmarks
人气: 来源:本站原创 作者:佚名 所属栏目:图片类 [切换到繁體中文]
介绍:可控制停止或播放幻灯,还带有上一张、下一张按钮。

演示:

[Ctrl+A全选 提示:你可先修改部分代码,再按运行]

下面教你如何应用此特效: 
 --------------------------------------------------------------------------------------
  需要在<body 这里>加入的代码:
 --------------------------------------------------------------------------------------
以下代码加到<head>…</head>中
以下代码加到<body>…</body>中
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin

var Onerotate_delay = 2000; // delay in milliseconds (5000 = 5 secs)
Onecurrent = 0;
var OneLinks = new Array(3);
OneLinks[0] = "http://www.zzsc.org";
OneLinks[1] = "http://www.zzsc.org";
OneLinks[2] = "http://www.zzsc.org";
function Onenext() {
if (document.Oneslideform.Oneslide[Onecurrent+1]) {
document.images.Oneshow.src = document.Oneslideform.Oneslide[Onecurrent+1].value;
document.Oneslideform.Oneslide.selectedIndex = ++Onecurrent;
   }
else Onefirst();
}
function Oneprevious() {
if (Onecurrent-1 >= 0) {
document.images.Oneshow.src = document.Oneslideform.Oneslide[Onecurrent-1].value;
document.Oneslideform.Oneslide.selectedIndex = --Onecurrent;
   }
else Onelast();
}
function Onefirst() {
Onecurrent = 0;
document.images.Oneshow.src = document.Oneslideform.Oneslide[0].value;
document.Oneslideform.Oneslide.selectedIndex = 0;
}
function Onelast() {
Onecurrent = document.Oneslideform.Oneslide.length-1;
document.images.Oneshow.src = document.Oneslideform.Oneslide[Onecurrent].value;
document.Oneslideform.Oneslide.selectedIndex = Onecurrent;
}
function Oneap(text) {
document.Oneslideform.Oneslidebutton.value = (text == "Stop") ? "Start" : "Stop";
Onerotate();
}
function Onechange() {
Onecurrent = document.Oneslideform.Oneslide.selectedIndex;
document.images.Oneshow.src = document.Oneslideform.Oneslide[Onecurrent].value;
}
function Onerotate() {
if (document.Oneslideform.Oneslidebutton.value == "Stop") {
Onecurrent = (Onecurrent == document.Oneslideform.Oneslide.length-1) ? 0 : Onecurrent+1;
document.images.Oneshow.src = document.Oneslideform.Oneslide[Onecurrent].value;
document.Oneslideform.Oneslide.selectedIndex = Onecurrent;
window.setTimeout("Onerotate()", Onerotate_delay);
}
}
function Onetransport(){
window.location=OneLinks[Onecurrent]
}
//  End -->
</SCRIPT>
<TABLE border="0" cellspacing="0" cellpadding="0">
  <TR>
    <TD>
      <form name="Oneslideform" >
        <DIV align="center">
          <TABLE width="150" border="1" cellspacing="0" cellpadding="4" bordercolor="#330099">
            <TR>
              <TD bgcolor="#330099">
                <DIV align="center"><B><FONT color="#FFFFFF">自动显示图片</FONT></B></DIV>
              </TD>
            </TR>
            <TR>
              <TD bgcolor="#FFFFFF">
                <DIV align="center"><A href="javascript:Onetransport()"><IMG src="/texiao/zzsc_demo/17.jpg" name="Oneshow" border="0"></A></DIV>
              </TD>
            </TR>
            <TR>
              <TD bgcolor="#330099">
                <DIV align="center">
                  <SELECT name="Oneslide" onChange="Onechange();">
                    <OPTION value="/texiao/zzsc_demo/17.jpg"  selected>图片 1</OPTION>
                    <OPTION value="/texiao/zzsc_demo/18.jpg">图片 2</OPTION>
                    <OPTION value="/texiao/zzsc_demo/19.jpg">图片 3</OPTION>
                  </SELECT>
      </DIV>
              </TD>
            </TR>
            <TR>
              <TD bgcolor="#330099">
                <DIV align="center">
                  <INPUT type=button onClick="Oneprevious();" value="<<" title="上一个">
                  <INPUT type=button name="Oneslidebutton" onClick="Oneap(this.value);" value="开始循环" title="自动显示">
                  <INPUT type=button onClick="Onenext();" value=">>" title="下一个">
          </DIV>
              </TD>
            </TR>
          </TABLE>
        </DIV>
      </form>
    </TD>
  </TR>
</TABLE>

  • 上一个特效:
  • 下一个特效:
  • 网友评论:(只显示最新10条。评论内容只代表网友观点,与本站立场无关!)
    姓 名: *(必填项) ·注册用户·
    Email: QQ号:
    评 分: 1分 2分 3分 4分 5分
    • 您可以发表评论支持你喜欢的文章。
    • 请遵守《互联网电子公告服务管理规定》
    • 请遵守中华人民共和国各项有关法律法规。
    • 严禁发表危害国家安全、政治、黄色淫秽等内容的评论。
    • 评论人需对自己在使用评论过程中的行为承担法律责任。
    • 本站管理员有权保留或删除评论内容。
    • 评论内容只代表个人观点,与本网站立场无关。
    站内特效搜索
    | 设为首页 | 加入收藏 | 联系站长 | 友情链接 | 版权申明 | | 京ICP备 05004866号 |
    版权所有 2007-2008 站长手册 WWW.ZZSC.ORG 业务联系 zzsc.org#gmail.com