日期:2014-05-16  浏览次数:20412 次

急:如何实现菜单图片点击变换
请教如何实现:下面是一个图片做成的菜单。点击第一个菜单图片1.gif,菜单一图片变为1a.gif。点击第二个菜单图片2.gif,菜单二的图片变为2a.gif。但同时菜单一图片需要变回去1.gif。同样道理,点击其他菜单图片时,菜单二的图片需要变回去2.gif。谢谢
<tr>
                        <td   > <a   href= "# "   class= "b ">   <img   border= "0 "   src= "image/1.gif "> </a> </td>
                        <td   > <a   href= "# "   class= "b "> <img   border= "0 "   src= "image/2.gif "> </a> </td>
                        <td   > <a   href= "# "   class= "b "> <img   border= "0 "   src= "image/3.gif "> </a> </td>
  </tr>

------解决方案--------------------
<table id= "tableId ">
<tr>
<td > <a href= "# " class= "b "> <img border= "0 " src= "image/1.gif "> </a> </td>
<td > <a href= "# " class= "b "> <img border= "0 " src= "image/2.gif "> </a> </td>
<td > <a href= "# " class= "b "> <img border= "0 " src= "image/3.gif "> </a> </td>
</tr>
</table>


<script language= "javascript ">
<!--
window.onload = function(){
document.getElementById( "tableId ").onclick = function(event){
event = window.event || event;
var srcElement = event.srcElement || event.target;
if(srcElement.tagName.toUpperCase() != "IMG ")return;

if(window._lastClickImg_){
window._lastClickImg_.src = window._lastClickImg_.src.replace( "a. ", ". ");
}
window._lastClickImg_ = srcElement;
srcElement.src = srcElement.src.replace( ". ", "a. ");
}
}
//-->
</script>
------解决方案--------------------
<tr>
<td> <a href= "# " class= "b " onclick= "swap( 'img1 ') "> <img border= "0 " id= "img1 " src= "image/1.gif "> </a> </td>
<td> <a href= "# " class= "b " onclick= "swap( 'img2 ') "> <img border= "0 " id= "img2 " src= "image/2.gif "> </a> </td>
<td> <a href= "# " class= "b " onclick= "swap( 'img3 ') "> <img border= "0 " id= "img3 " src= "image/3.gif "> </a> </td>
</tr>

<script language= "Javascript ">
srcs = new Array( "image/1.gif ", "image/2.gif ", "image/3.gif ");
newsrcs = new Array( "image/1a.gif ", "image/2a.gif ", "image/3a.gif ");
imgs = new Array( "img1 ", "img2 ", "img3 ");
function swap(oID)
{
o = document.getElementById(oID);
for(c=0;c <imgs.length;c++)
{
if(imgs[c] == oID) document.getEleme