<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script language="javascript">function showa(){for(var i=0;i<3;i++){
if(i=0){
document.getElementById("Layer1").style.display="block";
document.getElementById("Layer2").style.display="none";
document.getElementById("Layer3").style.display="none";
}
if(i=1){
document.getElementById("Layer1").style.display="none";
document.getElementById("Layer2").style.display="block";
document.getElementById("Layer3").style.display="none";
}
if(i=2){
document.getElementById("Layer1").style.display="none";
document.getElementById("Layer2").style.display="none";
document.getElementById("Layer3").style.display="block";
}}setTimeout("showa()",1000);
}</script>
</head><body onLoad="showa()">
<div id="Layer1" style="position:absolute;
left:65px;
top:48px;
width:308px;
height:178px;
z-index:1; display:block" ><img src="zaoshang11/11.jpg" width="300" height="180"/></div>
<div id="Layer2" style="position:absolute;
left:65px;
top:48px;
width:308px;
height:178px;
z-index:1; display:none" ><img src="zaoshang11/2.jpg" width="300" height="180"/></div>
<div id="Layer3" style="position:absolute;
left:65px;
top:48px;
width:308px;
height:178px;
z-index:1; display:none" ><img src="zaoshang11/3.jpg" width="300" height="180"/></div>
</body>
</html>开始图片11.jpg显示,以后每隔1秒,图片2.jpg,图片3.jpg,图片11.jpg轮换显示。···但是我写的代码,没有这种效果。请大家教我下
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script language="javascript">function showa(){for(var i=0;i<3;i++){
if(i=0){
document.getElementById("Layer1").style.display="block";
document.getElementById("Layer2").style.display="none";
document.getElementById("Layer3").style.display="none";
}
if(i=1){
document.getElementById("Layer1").style.display="none";
document.getElementById("Layer2").style.display="block";
document.getElementById("Layer3").style.display="none";
}
if(i=2){
document.getElementById("Layer1").style.display="none";
document.getElementById("Layer2").style.display="none";
document.getElementById("Layer3").style.display="block";
}}setTimeout("showa()",1000);
}</script>
</head><body onLoad="showa()">
<div id="Layer1" style="position:absolute;
left:65px;
top:48px;
width:308px;
height:178px;
z-index:1; display:block" ><img src="zaoshang11/11.jpg" width="300" height="180"/></div>
<div id="Layer2" style="position:absolute;
left:65px;
top:48px;
width:308px;
height:178px;
z-index:1; display:none" ><img src="zaoshang11/2.jpg" width="300" height="180"/></div>
<div id="Layer3" style="position:absolute;
left:65px;
top:48px;
width:308px;
height:178px;
z-index:1; display:none" ><img src="zaoshang11/3.jpg" width="300" height="180"/></div>
</body>
</html>开始图片11.jpg显示,以后每隔1秒,图片2.jpg,图片3.jpg,图片11.jpg轮换显示。···但是我写的代码,没有这种效果。请大家教我下
<script language="javascript">
var i=0;
function showa(){
i++;
if(i==3) i=1;
if(i=0){
document.getElementById("Layer1").style.display="block";
document.getElementById("Layer2").style.display="none";
document.getElementById("Layer3").style.display="none";
}
if(i=1){
document.getElementById("Layer1").style.display="none";
document.getElementById("Layer2").style.display="block";
document.getElementById("Layer3").style.display="none";
}
if(i=2){
document.getElementById("Layer1").style.display="none";
document.getElementById("Layer2").style.display="none";
document.getElementById("Layer3").style.display="block";
} setTimeout("showa()",1000);
} </script>
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script language="javascript">
var i=0;
function showa(){
i++;
if(i==3)
i=1;
if(i=0){
document.getElementById("Layer1").style.display="block";
document.getElementById("Layer2").style.display="none";
document.getElementById("Layer3").style.display="none";
}
if(i=1){
document.getElementById("Layer1").style.display="none";
document.getElementById("Layer2").style.display="block";
document.getElementById("Layer3").style.display="none";
}
if(i=2){
document.getElementById("Layer1").style.display="none";
document.getElementById("Layer2").style.display="none";
document.getElementById("Layer3").style.display="block";
}setTimeout("showa()",1000);
}</script>
</head><body onLoad="showa()">
<div id="Layer1" style="position:absolute;
left:65px;
top:48px;
width:308px;
height:178px;
z-index:1; display:block" ><img src="zaoshang11/11.jpg" width="300" height="180"/></div>
<div id="Layer2" style="position:absolute;
left:65px;
top:48px;
width:308px;
height:178px;
z-index:1; display:none" ><img src="zaoshang11/2.jpg" width="300" height="180"/></div>
<div id="Layer3" style="position:absolute;
left:65px;
top:48px;
width:308px;
height:178px;
z-index:1; display:none" ><img src="zaoshang11/3.jpg" width="300" height="180"/></div>
</body>
</html>
document.getElementById("Layer1").style.display="block";
document.getElementById("Layer2").style.display="none";
document.getElementById("Layer3").style.display="none";
}
if(i==1){
document.getElementById("Layer1").style.display="none";
document.getElementById("Layer2").style.display="block";
document.getElementById("Layer3").style.display="none";
}
if(i==2){
document.getElementById("Layer1").style.display="none";
document.getElementById("Layer2").style.display="none";
document.getElementById("Layer3").style.display="block";
}
<!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" />
<title>图片测试</title>
<script language="javascript" >
function g(o){return document.getElementById(o);}
function HoverLi(n){
for(var i=1;i<=2;i++){g('tb_'+i).className='normaltab';g('tbc_0'+i).className='undis';}g('tbc_0'+n).className='dis';g('tb_'+n).className='hovertab';
}
function g(o){return document.getElementById(o);}
function HoverLi1(n){
for(var i=1;i<=2;i++){g('tb0_'+i).className='normaltab0';g('tbc0_0'+i).className='undis0';}g('tbc0_0'+n).className='dis0';g('tb0_'+n).className='hovertab0';
}
</script>
</head>
<body>
<table width="960" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td >
<div class="subcont">
<script type="text/javascript">
ycn=window.ycnui||{};
ycn.Common=new function(){this.lTrim=function(i){return i.replace(/^\s*/,"");};this.rTrim=function(i){return i.replace(/\s*$/,"");};this.trim=function(i){return this.rTrim(this.lTrim(i));};this.getEl=function(i){if(!document.getElementById)return false;if(typeof i==="string"){return document.getElementById(i);}else{return i;}};this.getElByClassName=function(t,n,s,el){var el=(el)?el:document;var itm=el.getElementsByTagName(t);var num=1;for(i=0;i<itm.length;i++){if(itm[i].className===n&&s===num){return itm[i];}else if(itm[i].className===n){num++;}}
return false;};
this.isIE6=function(){return navigator.userAgent.search('MSIE')>0&&navigator.userAgent.search('6')>0;}
this.isIE=function(){return navigator.userAgent.search('MSIE')>0;}
this.isOpera=function(){return navigator.userAgent.indexOf('Opera')>-1;}
this.isMoz=function(){return navigator.userAgent.indexOf('Mozilla/5.')>-1;}
this.setCookie=function(cn,cv,d,dm){var now=new Date();var expire=new Date();if(d==null||d==0)d=1;expire.setTime(now.getTime()+3600000*24*d);document.cookie=cn+"="+escape(cv)
+";expires="+expire.toGMTString()
+";domain="+dm;}
this.deleteCookie=function(cn,dm){if(getCookie(name))
{document.cookie=cn+"="+
((domain)?"; domain="+dm:"")+"; expires=Thu, 01-Jan-70 00:00:01 GMT";}}
this.getCookie=function(cn)
{var dc=document.cookie;var prefix=cn+"=";var begin=dc.indexOf("; "+prefix);if(begin==-1)
{begin=dc.indexOf(prefix);if(begin!=0)return null;}
else
{begin+=2;}
var end=document.cookie.indexOf(";",begin);if(end==-1)
{end=dc.length;}
return unescape(dc.substring(begin+prefix.length,end));}};
ycn=window.ycn||{};ycn.Event={addEvent:function(obj,evType,fn){if(obj.addEventListener)
{obj.addEventListener(evType,fn,false);return true;}
else if(obj.attachEvent)
{var r=obj.attachEvent("on"+evType,fn);ycn.EventCache.add(obj,evType,fn);return r;}
else
{return false;}},removeEvent:function(obj,evType,fn){if(obj.removeEventListener){obj.removeEventListener(evType,fn,false);return true;}else if(obj.detachEvent){var r=obj.detachEvent("on"+evType,fn);return r;}else{return false;}},getEvent:function(e)
{e=window.event||e;e.leftButton=false;if(e.srcElement==null&&e.target!=null)
{e.srcElement=e.target;e.leftButton=(e.button==1);}
else if(e.target==null&&e.srcElement!=null)
{e.target=e.srcElement;e.leftButton=(e.button==0);}
else if(e.srcElement!=null&&e.target!=null)
{}
else{return null}
if(document.body&&document.documentElement)
{e.mouseX=e.pageX||(e.clientX+Math.max(document.body.scrollLeft,document.documentElement.scrollLeft));e.mouseY=e.pageY||(e.clientY+Math.max(document.body.scrollTop,document.documentElement.scrollTop));}
else
{e.mouseX=-1;e.mouseY=-1;}
return e;},stopEvent:function(e)
{if(e&&e.cancelBubble!=null)
{e.cancelBubble=true;e.returnValue=false;}
if(e&&e.stopPropagation&&e.preventDefault)
{e.stopPropagation();e.preventDefault();}
return false;}};ycn.EventCache=function()
{var listEvents=[];return{listEvents:listEvents,add:function(node,sEventName,fHandler,bCapture){listEvents[listEvents.length]=arguments;},flush:function(){var i,item;for(i=listEvents.length-1;i>=0;i=i-1)
{item=listEvents[i];if(item[0].removeEventListener){item[0].removeEventListener(item[1],item[2],item[3]);};if(item[1].substring(0,2)!="on"){item[1]="on"+item[1];};if(item[0].detachEvent){item[0].detachEvent(item[1],item[2]);};item[0][item[1]]=null;};}};}();ycn.Event.addEvent(window,"unload",ycn.EventCache.flush);function error_handler(a,b,c)
{window.status=(c+"\n"+b+"\n\n"+a+"\n\n"+error_handler.caller);return true;}
slidePlayer.prototype.container=null;slidePlayer.prototype.imageList=null;slidePlayer.prototype.width=0;slidePlayer.prototype.height=0;slidePlayer.prototype.currentNum=1;slidePlayer.prototype.playTimer=null;slidePlayer.prototype.loopTimer;slidePlayer.prototype.intervalTime=50;slidePlayer.prototype.waiting=2000;slidePlayer.prototype.isPause=false;slidePlayer.prototype.isPlaying=false;slidePlayer.prototype.endPlay=new Function;slidePlayer.prototype.initial=new Function;slidePlayer.prototype.getCurrnetNum=function(){return this.currentNum;};slidePlayer.prototype.goToPlay=function(n){var o=this;if(o.playTimer||o.playTimer!=null){window.clearInterval(o.playTimer);}
if(o.loopTimer){window.clearTimeout(o.loopTimer);}
var d;for(var i=0;i<o.imageList.length;i++){o.imageList[i].style.display="none";if(o.imageList[i].parentNode&&o.imageList[i].parentNode.tagName.toLowerCase()=='a'){d=o.imageList[i].parentNode;}else{d=o.imageList[i];}
d.style.zIndex="1";d.style.filter="alpha(opacity=100)";d.style.MozOpacity=1;d.style.opacity=1;}
o.isPlaying=false;o.imageList[o.currentNum-1].style.display="block";o.play(n);};slidePlayer.prototype.play=function(num){var o=this;if(o.isPlaying){return;}
if(num){var nn=num;var on=o.currentNum;}else{var nn=o.currentNum+1;var on=o.currentNum;}
if(nn>o.imageList.length){nn=1;}
if(on==nn){o.loopTimer=window.setTimeout(function(){o.play();},o.waiting);return;}
if(o.playTimer||o.playTimer!=null){window.clearInterval(o.playTimer);}
if(o.loopTimer){window.clearTimeout(o.loopTimer);}
var n_el=(o.imageList[nn-1].parentNode&&o.imageList[nn-1].parentNode.tagName.toLowerCase()=='a')?o.imageList[nn-1].parentNode:o.imageList[nn-1];var o_el=(o.imageList[on-1].parentNode&&o.imageList[on-1].parentNode.tagName.toLowerCase()=='a')?o.imageList[on-1].parentNode:o.imageList[on-1];n_el.style.zIndex=1;o_el.style.zIndex=10;o_el.style.filter="alpha(opacity=100)";o_el.style.MozOpacity=1;o_el.style.opacity=1;n_el.style.filter="alpha(opacity=100)";n_el.style.MozOpacity=1;n_el.style.opacity=1;o.imageList[nn-1].style.display="block";o.isPlaying=true;var n=100;var _is_start=false;var anim=function(){if(o.isPause){o_el.style.filter="alpha(opacity=100)";o_el.style.MozOpacity=1;o_el.style.opacity=1;return;}
n-=20;_is_start=true;if(n<=0){o_el.style.filter="alpha(opacity=0)";o_el.style.MozOpacity=0;o_el.style.opacity=0;o_el.style.zIndex=1;o.imageList[on-1].style.display="none";o.isPlaying=false;o.currentNum=nn;o.loopTimer=window.setTimeout(function(){o.play();},o.waiting);window.clearInterval(o.playTimer);o.endPlay();}else{o_el.style.filter="alpha(opacity="+n+")";o_el.style.MozOpacity=n/100;o_el.style.opacity=n/100;}}
o.playTimer=window.setInterval(anim,o.intervalTime);};function slidePlayer(con_id){var o=this;var cont=ycn.Common.getEl(con_id);if(!cont){return;}
var imgs=cont.getElementsByTagName("img");if(!imgs||imgs.length<=0){return;}
o.container=cont;o.imageList=imgs;var img=new Image();img.src=imgs[0].src;o.width=img.width;o.height=img.height;o.container.style.width=o.width+"px";o.container.style.height=o.height+"px";imgs[0].style.display="block";o.loopTimer=window.setTimeout(function(){o.play();},o.waiting);o.initial();}
function is_support() { var iFrom = navigator.appVersion.indexOf("MSIE ");
var ieVer = parseFloat(navigator.appVersion.substring(iFrom+5, iFrom+9));
if(iFrom>0 && ieVer<5.5){
return false; }
else
return true; }
function init_slide(){
if(!document.getElementById('slide-imgs')) return;
var obj = new slidePlayer('slide-imgs'),slidenum,t_num,li;
obj.waiting = 2000;
if(obj && ycn.Common.getElByClassName('div','slide_addone',1)){
ycn.Common.getEl('slideContent').innerHTML = ycn.Common.getElByClassName('div','slide_addone',1).innerHTML;
}
slidenum = ycn.Common.getEl('slidenum');
if(obj && slidenum){
t_num = "<ul class=\"slideNumber\"><li class=\"curSlideNumber\">1</li>";
for(var i=1;i<obj.imageList.length; i++){
t_num +="<li>"+(i+1)+"</li>";
}
t_num += "</ul>"
slidenum.innerHTML = t_num;
li = slidenum.getElementsByTagName("li");
for(var j=0; j<li.length;j++){
ycn.Event.addEvent(li[j],'click',function(e){
obj.isPause = false;
var el = (navigator.userAgent.toLowerCase().indexOf('msie')>0)? e.srcElement : this;
for(var i=0; i<li.length;i++){
li[i].className = '';
}
el.className = "curSlideNumber";
obj.goToPlay(parseInt(el.innerHTML));
});
}
}
var cnum = obj.getCurrnetNum();
var con = ycn.Common.getEl('slide_content_'+cnum),tit,mlnk,rlnk,desc;
if(is_support()&&con){
if((tit = ycn.Common.getElByClassName("div","slide_tit",1,con))){ycn.Common.getEl('slide_tit').innerHTML = tit.innerHTML;}
if((mlnk = ycn.Common.getElByClassName("div","slide_more",1,con))){ycn.Common.getEl('slide_more').innerHTML = mlnk.innerHTML;}
if((rlnk = ycn.Common.getElByClassName("div","slide_rellink",1,con))){ycn.Common.getEl('slide_rellink').innerHTML = rlnk.innerHTML;}
if((desc = ycn.Common.getElByClassName("div","slide_desc",1,con))){ycn.Common.getEl('slide_desc').innerHTML = desc.innerHTML;}
}
if(li){
for(var i=0; i<li.length;i++){
li[i].className = '';
}
li[obj.getCurrnetNum()-1].className = 'curSlideNumber';
}
}
ycn.Event.addEvent(obj.container,'mouseover',function(){obj.isPause = true;});
ycn.Event.addEvent(obj.container,'mouseout',function(){obj.isPause = false;});
obj.isPause = true;
var begin_t = window.setTimeout(function(){window.clearTimeout(begin_t);obj.isPause=false;},obj.waiting);
}
if(is_support()) ycn.Event.addEvent(window,"load",init_slide);
try {
document.execCommand('BackgroundImageCache', false, true);
} catch(e) {}
</script>
<style>
#slidesshow {
BORDER-RIGHT: #2b2b2b 1px solid; BORDER-TOP: #2b2b2b 1px solid; BACKGROUND: #fff; OVERFLOW: hidden; BORDER-LEFT: #2b2b2b 1px solid; WIDTH: 300px; BORDER-BOTTOM: #2b2b2b 1px solid; HEIGHT: 154px;
}
#ss-mod {
MARGIN: 0px; OVERFLOW: hidden; WIDTH: 300px; POSITION: relative; HEIGHT: 154px;
}
.slidenum {
HEIGHT: 20px; BACKGROUND-COLOR: #c8e5f7
}
#slidenum {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; Z-INDEX: 30; LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; POSITION: absolute; TOP: 142px; HEIGHT: 13px
}
.slideNumber {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; WIDTH: 300px; LINE-HEIGHT: 13px; PADDING-TOP: 0px; HEIGHT: 13px;
}
.slideNumber LI {
DISPLAY: inline; FONT-WEIGHT: bold; FONT-SIZE: 11px; BACKGROUND: url('images/litopbg.gif') repeat-x left center; FLOAT: left; MARGIN: 0px 0px; OVERFLOW: hidden; WIDTH: 28px; CURSOR: hand; COLOR: #fff; LINE-HEIGHT: 13px; FONT-FAMILY: arial; HEIGHT: 13px; TEXT-ALIGN: center;
}
.slideNumber LI.curSlideNumber {
BACKGROUND: url('images/litopbgc.gif') repeat-x left center; COLOR: #000
}
.slidecontainer {
POSITION: relative; HEIGHT: 225px
}
.slideimages {
FLOAT: left; WIDTH: 300px; HEIGHT: 225px
}
.slideimages IMG {
BORDER-TOP-WIDTH: 0px; DISPLAY: none; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; HEIGHT: 154px; BORDER-RIGHT-WIDTH: 0px
}
.slideimages A {
BORDER-RIGHT: #324251 1px solid; BORDER-TOP: #324251 1px solid; LEFT: 0px; BORDER-LEFT: #324251 1px solid; BORDER-BOTTOM: #324251 1px solid; POSITION: absolute; TOP: 0px;
}
#slide_desc {
FONT-WEIGHT: bold; Z-INDEX: 30; LEFT: 1px; OVERFLOW: hidden; WIDTH: 300px; COLOR: #ffffff; TEXT-INDENT: 10px; LINE-HEIGHT: 24px; WHITE-SPACE: nowrap; POSITION: absolute; TOP: 1px; HEIGHT: 24px; text-align:right;
}
#slide_desc_bg {
Z-INDEX: 29; BACKGROUND: #000000; FILTER: alpha(opacity=50); LEFT: 0px; WIDTH: 300px; LINE-HEIGHT: 24px; POSITION: absolute; TOP: 0px; HEIGHT: 24px; opacity: .8
}
#slide_desc P {
PADDING-RIGHT: 10px
}
</style>
<div id="slidesshow">
<!--start:幻灯-->
<div id="ss-mod">
<!--图-->
<div id="slide-imgs" class="slidecontainer">
<div class="slideimages">
<a href="#" target="_blank">
<img src="images/flash1.gif" /></a>
<a href="#" target="_blank">
<img src="images/flash.gif" /></a>
<a href="#" target="_blank">
<img src="images/flash3.gif" /></a>
<a href="#" target="_blank">
<img src="images/flash.gif" /></a>
</div>
</div>
<div id="slidenum"></div>
<!--end:图-->
<div id="slide_desc"></div>
<div id="slide_desc_bg"></div>
<!--{{start:说明 -->
<div id="slide_content_1" style="display:none">
<div class="slide_desc">
微软时钟界面设计
</div>
</div>
<div id="slide_content_2" style="display:none">
<div class="slide_desc">
彩色个性的头发
</div>
</div>
<div id="slide_content_3" style="display:none">
<div class="slide_desc">
微软时钟界面设计
</div>
</div>
<div id="slide_content_4" style="display:none">
<div class="slide_desc">
彩色个性的头发UI设计
</div>
</div>
</div> <!--}}end:说明 -->
<!--{{start:slide js -->
<script>
function load_ys_slide(){
var con = ycn.Common.getEl('slide_content_1'),tit,mlnk,rlnk,desc;
if(con){
if(is_support())
if((desc = ycn.Common.getElByClassName("div","slide_desc",1,con))){ycn.Common.getEl('slide_desc').innerHTML = desc.innerHTML;}
}
}
load_ys_slide();
</script>
</div>
</div>
</td>
</tr>
</table>
</body>
</html>