Table cells that activate other tables with javascript by changing the z-index -
i have no idea how isn't working. i've tried switching around properties, putting divs inside each table cell , using "click" function. no matter can't seem working. need thhe table cell weblink info in it, click , open secondary table using z-index format overlap them. if can appreciated.
<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> </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>
your dom isn't loaded when try bind handler click event. try:
$(document).ready(function(){ $('#weblinkbut').click(function(){ $('.menuhome').css('z-index','3'); $('.weblinkmenu').css('z-indez','4'); }); });
Comments
Post a Comment