关于层与层之间的切换问题求助，DIV+JS

楼主是意思是要扩展性良好~~~
<html>
<script>
function ShowMyDiv(link){
    var div = document.getElementById(link.div);
    if(window.ShowingDiv)window.ShowingDiv.style.display="none";
    div.style.display="block";
    window.ShowingDiv=div;
}
</script>
<body>
<a href="#" onclick="ShowMyDiv(this);return false;" div="TdOne">TdOne内容部分</a>
<a href="#" onclick="ShowMyDiv(this);return false;" div="TdTwo">TdTwo内容部分</a>
<a href="#" onclick="ShowMyDiv(this);return false;" div="TdThree">TdThree 内容部分</a>
<div id="TdOne" style="display:block">TdOne内容部分</div>
<div id="TdTwo" style="display:none">TdTwo内容部分</div>
<div id="TdThree" style="display:none">TdThree 内容部分</div>
</body>
</html>

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

问题简单地就是说把以下各层用不同或一种比较好的的变换效果进行自动切换，层的数量可以任意增减，也要firefox浏览器支持。不用考虑我上面所说的JS。全部用新的JS实现。<div id="TdOne">TdOne内容部分</div>
<div id="TdTwo">TdTwo内容部分</div>
<div id="TdThree">TdThree 内容部分</div>
修改到火狐支持<html>
<script>
function ShowMyDiv(link){
    var div = document.getElementById(link.getAttribute("div"));
    if(typeof(window.ShowingDiv)!="undefined")window.ShowingDiv.style.display="none";
    div.style.display="block";
    window.ShowingDiv=div;
}
window.onload=function(){
    window.ShowingDiv=document.getElementById("TdOne");
}
</script>
<body>
<a href="#" onclick="ShowMyDiv(this);return false;" div="TdOne">TdOne内容部分</a>
<a href="#" onclick="ShowMyDiv(this);return false;" div="TdTwo">TdTwo内容部分</a>
<a href="#" onclick="ShowMyDiv(this);return false;" div="TdThree">TdThree 内容部分</a>
<div id="TdOne" style="display:block">TdOne内容部分</div>
<div id="TdTwo" style="display:none">TdTwo内容部分</div>
<div id="TdThree" style="display:none">TdThree 内容部分</div>
</body>
</html>
OK，抛开以上所有东西，就是在网页同一个地方，N种内容做成N层，进行自动切换显示。不用加点击。如：<div id="1">
<table width="160" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>标题1</td>
  </tr>
  <tr>
    <td><img src="1.jpg" alt="images" width="160" height="56" /></td>
  </tr>
  <tr>
    <td height="47">内容1内容1内容1内容1内容1内容1内容1内容1内容1</td>
  </tr>
  <tr>
    <td><a href="#1">link1link1</a></td>
  </tr>
</table>
</div><div id="2">
<table width="160" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>标题2</td>
  </tr>
  <tr>
    <td><img src="2.jpg" alt="images" width="160" height="56" /></td>
  </tr>
  <tr>
    <td height="47">内容2内容2内容2内容2内容2内容2内容2内容2内容2</td>
  </tr>
  <tr>
    <td><a href="#2">link2link2</a></td>
  </tr>
</table>
</div><div id="3">
<table width="160" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>标题3</td>
  </tr>
  <tr>
    <td><img src="3.jpg" alt="images" width="160" height="56" /></td>
  </tr>
  <tr>
    <td height="47">内容3内容3内容3内容3内容3内容3内容3内容3内容3</td>
  </tr>
  <tr>
    <td><a href="#3">link3link3</a></td>
  </tr>
</table>
</div>想把以上三个层（<div>）实现自动切换，切换效果用（好象是这样的filters.revealTrans.Transition=Math.floor(Math.random()*23);），也可以用一种淡出淡进的效果。
晕死,只要把onclick换成onmouseover就行啦,效果你自己做吧~那个是滤镜吗?ff支持吗?<html>
<script>
function ShowMyDiv(link){
    var div = document.getElementById(link.getAttribute("div"));
    if(typeof(window.ShowingDiv)!="undefined")window.ShowingDiv.style.display="none";
    div.style.display="block";
    window.ShowingDiv=div;
}
window.onload=function(){
    window.ShowingDiv=document.getElementById("1");
}
</script>
<body>
<a href="#" onmouseover="ShowMyDiv(this);return false;" div="1">111</a>
<a href="#" onmouseover="ShowMyDiv(this);return false;" div="2">222</a>
<a href="#" onmouseover="ShowMyDiv(this);return false;" div="3">333</a><div id="1" style="display:block">
<table width="160" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>标题1</td>
  </tr>
  <tr>
    <td><img src="1.jpg" alt="images" width="160" height="56" /></td>
  </tr>
  <tr>
    <td height="47">内容1内容1内容1内容1内容1内容1内容1内容1内容1</td>
  </tr>
  <tr>
    <td><a href="#1">link1link1</a></td>
  </tr>
</table>
</div><div id="2" style="display:none">
<table width="160" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>标题2</td>
  </tr>
  <tr>
    <td><img src="2.jpg" alt="images" width="160" height="56" /></td>
  </tr>
  <tr>
    <td height="47">内容2内容2内容2内容2内容2内容2内容2内容2内容2</td>
  </tr>
  <tr>
    <td><a href="#2">link2link2</a></td>
  </tr>
</table>
</div><div id="3" style="display:none">
<table width="160" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>标题3</td>
  </tr>
  <tr>
    <td><img src="3.jpg" alt="images" width="160" height="56" /></td>
  </tr>
  <tr>
    <td height="47">内容3内容3内容3内容3内容3内容3内容3内容3内容3</td>
  </tr>
  <tr>
    <td><a href="#3">link3link3</a></td>
  </tr>
</table>
</div>
</body>
</html>
LZ可以试一下这个，因为是我自己写的所以应用时可能还需要优化。
在这个例子里增加层时不用添事件，只需要增加相应的DIV和SPAN即可，但FUN，TAR的属性是是一定要正确配置的FUN是元素类型，TAR是目标层ID
<html>
<head>
<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
<style>
div
{
float:none;
border:solid 1px darkgray;
}
span.on
{
font-size:23px;
color:black;
font-weight:bold;
border:solid 2px darkgray;
background-color:darkgray;
}
span.off
{
font-size:20px;
color:darkgray;
cursor:pointer;
background-color:lightgrey;
border:solid 1px darkgray;
vertical-align:bottom;
}
</style>
</head>
<script language="javascript">

</script>
<body onload="initTabGroups();"  bgColor="#e7e7e7">
<span id="defaultTab" fun="tab" tar="a1">111111111</span> <span fun="tab" tar="a2">22222222222</span>
<div style="background-color:darkgray;height:5px;"></div>
<div fun="block" id="a1">111111111<br>111111111111</div>
<div fun="block" id="a2">222222<br>2222222222</div>
</body>
</html>
真不好意思，以上答案都不是我想要的，不过我现有一段代码，你们帮帮看看，怎么能做到让firefox浏览器支持。<html>
<head>
<title>层与层的切换</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style type="text/css">

</style>
<script language="JavaScript">

</script>
</head><body bgcolor="#FFFFFF"><div id=idParentDiv><div id="d_1" class="tranDiv" style="visibility:visible"><img src="http://www.xpajax.com/images/t1.gif" alt="问题" border="0" />
<br>
<a href="http://http://wwww.test1.com" target="_blank"><img src="http://www.xpajax.com/images/a1.gif" alt="问题" border="0" /></a>
<br>
问曰：世人轻人、骗我、谤我、欺我、笑我、妒我、辱我、害我，可以处之？
<br>
<a href="http://wwww.test1.com" target="_blank">了解更多</a></div>
<div id="d_2" class="tranDiv" style="visibility:hidden"><img src="http://www.xpajax.com/images/t2.gif" alt="答案" border="0" />
<br>
<a href="http://http://wwww.test2.com" target="_blank"><img src="http://www.xpajax.com/images/a2.gif" alt="答案" border="0" /></a>
<br>
答曰：唯有敬他、容他、让他、耐他、随他、避他、不理他、再过几时看他...
<br>
<a href="http://wwww.test2.com" target="_blank">了解更多</a></div></div></body>
</html>
楼主想要定时自动变换也不早说,而且已经跟你说过了,ff不支持ie的滤镜~~~