2013-05-21 127 views
1

我不知道这是如何工作的。我试着切换属性,将div放在每个表格单元格中,并将其用于“单击”功能。但是无论我做什么,我似乎都无法让它工作。我需要的仅仅是带有web链接信息的表格单元格,用z-index格式点击并打开辅助表格以重叠它们。如果任何人都可以帮助它,将不胜感激。通过更改z-index激活其他表格的单元格

<script src="../js/jquery-1.8.3.min.js" type="text/javascript"></script> 

<script type="text/javascript"> 
    $('#weblinkbut').click(function(){ 
     $('.menuhome').css('z-index','3'); 
     $('.weblinkmenu').css('z-indez','4'); 
    }); 
</script> 

</head> 

<body> 
<div id="weblinkbut"> 
<p>content</p> 
</div> 

<div id="menuhome"> 
<table class="menuhome" width="181" height="208" border="1" 
    bordercolor="#000000" cellspacing="5" bgcolor="#FFFFFF" cellpadding=""> 
<tr> 
<td width="75" height="90"><p>&nbsp;</p><p><img src="images/weblinkicon.png" 
    width="40" height="40"></p> 
    <p>Website link</p></div></td> 
    <td width="75" height="90"><p><img src="images/phoneicon.png" 
    width="40" height="40"></p> 
    <p>Phone Number</p></td> 
</tr> 
<tr> 
    <td width="75" height="90"><p><img src="images/emailicon.jpg" width="40"  
     height="40"></p> 
    <p>Email address</p></td> 
    <td width="75" height="90"><p><img src="images/newdocicon.png" width="30" 
    height="40"> 
    <P>Plain Text</P>  
</tr> 
</table> 
</div> 

<div id="weblinkmenu"> 
<table class="weblinkmenu" width="181" height="208" border="1"  
    bordercolor="#000000" cellspacing="5" bgcolor="#FFFFFF" cellpadding=""> 
    <tr> 
     <td width="75" height="90"><p><img src="images/weblinkicon.png" 
       width="40" height="40"></p> 
      <p>Website link</p></td> 
    </tr> 
</table> 
</div> 

</body> 

    </html> 

回答

1

当您尝试绑定单击事件的处理程序时,您的DOM未完全加载。 尝试:

$(document).ready(function(){ 
    $('#weblinkbut').click(function(){ 
    $('.menuhome').css('z-index','3'); 
    $('.weblinkmenu').css('z-indez','4'); 
    }); 
}); 
+0

没有工作。我复制并粘贴了您发送到我的文档中的脚本,但仍然没有任何内容。我试图使用表格单元格,其中的web链接图标,所以当我点击它时,我会打开与css风格z-index重叠的menuhome的weblinkmenu。 –

相关问题