教程集 www.jiaochengji.com
Golang 教程
教程集 >  脚本编程  >  javascript  >  正文 纯javascript 仿flash图片切换代码

纯javascript 仿flash图片切换代码

发布时间：2016-10-24   编辑：jiaochengji.com
教程集为您提供纯javascript 仿flash图片切换代码等资源，欢迎您收藏本站，我们将为您提供最新的纯javascript 仿flash图片切换代码资源
提示：您可以先修改部分代码再运行

<textarea name="runcool" rows="28" cols="75" > <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>中国站长天空-网页特效-图片特效-带缩略图的图片幻灯切换效果</title> <meta http-equiv="content-type" content="text/html;charset=gb2312"> <style type="text/css"> BODY { FONT-SIZE: 9pt; BACKGROUND: #d8d8d8; MARGIN: 0px auto; COLOR: #505050; FONT-FAMILY: 宋体,arial,verdana,sans-serif,fantasy,tahoma; TEXT-DECORATION: none; background1: #c8e4f2 } A { TEXT-DECORATION: none } A:link { COLOR: #505050; color1: #54564c } A:visited { COLOR: #505050; color1: #54564c } A:hover { COLOR: #d40005; TEXT-DECORATION: underline } A:active { COLOR: #f30 } IMG { BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px } .box { FLOAT: left; WIDTH: 472px } .box .boxpadding { PADDING-RIGHT: 8px; PADDING-LEFT: 8px; MARGIN-BOTTOM: 0px; PADDING-BOTTOM: 8px; PADDING-TOP: 8px } #Slide { CLEAR: both; BORDER-RIGHT: #fff 1px solid; BORDER-TOP: #fff 1px solid; MARGIN-BOTTOM: 6px; OVERFLOW: hidden; BORDER-LEFT: #fff 1px solid; WIDTH: 450px; BORDER-BOTTOM: #fff 1px solid; HEIGHT: 335px } #Slide A { COLOR: #000 } .img { BORDER-RIGHT: #fff 1px solid; BACKGROUND: #fff; MARGIN: 0px auto; BORDER-LEFT: #fff 1px solid; TEXT-ALIGN: center } .boxpadding { BORDER-RIGHT: #fff 1px solid; BORDER-TOP: #fff 1px solid; BACKGROUND: #f8f8f8; MARGIN-BOTTOM: 8px; BORDER-LEFT: #fff 1px solid; PADDING-TOP: 10px; BORDER-BOTTOM: #fff 1px solid } .thumb_title { MARGIN-TOP: 10px; BACKGROUND: #fff; FILTER: alpha(opacity=30); WIDTH: 450px; TEXT-INDENT: 10px; LINE-HEIGHT: 25px; POSITION: absolute; HEIGHT: 25px; -moz-opacity: 0.3 } #Slide_Thumb { MARGIN-TOP: 257px; MARGIN-LEFT: 0px; POSITION: absolute } .thumb_on { DISPLAY: inline; FLOAT: left; MARGIN-LEFT: 8px; CURSOR: pointer } .thumb_off { DISPLAY: inline; FLOAT: left; MARGIN-LEFT: 8px; CURSOR: pointer } .thumb_off { FILTER: alpha(opacity=50); -moz-opacity: 0.5 } .thumb_on { FILTER: alpha(opacity=100); -moz-opacity: 1 } .thumb_off IMG { BORDER-RIGHT: #fff 1px solid; BORDER-TOP: #fff 1px solid; MARGIN-TOP: 12px; BORDER-LEFT: #fff 1px solid; WIDTH: 75px; BORDER-BOTTOM: #fff 1px solid; HEIGHT: 56px } .thumb_on IMG { BORDER-RIGHT: #fff 1px solid; BORDER-TOP: #fff 1px solid; BORDER-LEFT: #fff 1px solid; WIDTH: 91px; BORDER-BOTTOM: #fff 1px solid; HEIGHT: 68px } </style> </head> <body> <table width="472" height="511" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td width="472">
纯javascript 仿flash图片切换代码
图一
纯javascript 仿flash图片切换代码
纯javascript 仿flash图片切换代码
纯javascript 仿flash图片切换代码
纯javascript 仿flash图片切换代码
纯javascript 仿flash图片切换代码
<script language=javascript type="text/javascript"> var picarry = {}; var lnkarry = {}; var ttlarry = {}; picarry[0] = "http://filesimg.jiaochengji.com/20091130092407179.jpg"; lnkarry[0] = "#"; ttlarry[0] = "图一"; picarry[1] = "http://filesimg.jiaochengji.com/20091130092414940.jpg"; lnkarry[1] = "#"; ttlarry[1] = "图二"; picarry[2] = "http://filesimg.jiaochengji.com/20091130092420203.jpg"; lnkarry[2] = "#"; ttlarry[2] = "图三"; picarry[3] = "http://filesimg.jiaochengji.com/20091130092426269.jpg"; lnkarry[3] = "#"; ttlarry[3] = "图四"; picarry[4] = "http://filesimg.jiaochengji.com/2009113009243356.jpg"; lnkarry[4] = "#"; ttlarry[4] = "图五"; </script>
</td> </tr> </table>
<script type="text/javascript"> var currslid = 0; var slidint; function setfoc(id){ document.getElementById("focpic").src = picarry[id]; document.getElementById("foclnk").href = lnkarry[id]; document.getElementById("foctitle").innerHTML = '' ttlarry[id] ''; currslid = id; for(i=0;i<5;i ){ document.getElementById("tmb" i).className = "thumb_off"; }; document.getElementById("tmb" id).className ="thumb_on"; focpic.style.visibility = "hidden"; focpic.filters[0].Apply(); if (focpic.style.visibility == "visible") { focpic.style.visibility = "hidden"; focpic.filters.revealTrans.transition=23; } else { focpic.style.visibility = "visible"; focpic.filters[0].transition=23; } focpic.filters[0].Play(); stopit(); } function playnext(){ if(currslid==4){ currslid = 0; } else{ currslid ; }; setfoc(currslid); playit(); } function playit(){ slidint = setTimeout(playnext,4500); } function stopit(){ clearTimeout(slidint); } window.onload = function(){ playit(); } </body> </html></textarea>
提示：您可以先修改部分代码再运行

您可能感兴趣的文章：
纯javascript 仿flash图片切换代码
javascript 仿flash焦点图片切换代码
jquery仿flash 个性实用的新闻图片联动标题效果
经典的仿切片滤镜的图片幻灯切换效果
js 带缩略图纯javascript图片切换代码
javascript 淡入式图片幻灯切换效果(带说明的)
仿discuz 论坛 LightBox图片相册查看代码！
js 仿flash图片切换代码
javascript flash新浪新闻频道图片幻灯切换效果
jquery仿QQ商城带左右按钮控制焦点图片切换滚动效果

上一篇：导航菜单-简洁的纯CSS二级下拉菜单 下一篇：js经典级联菜单
[关闭]
最近更新
浏览排行

关于本站 | 网站地图 | 联系我们 | 免责声明 | 友情链接
京ICP备12039225号-6 广告合作请加QQ:441358019
CopyRight © 2010-2014 教程集 jiaochengji.com , All Rights Reserved.

~ ~