Div menu next to the button
I have simple html page:
<html>
<head></head>
<body>
<table>
<tr>
<td>
开发者_如何学Go <input type="image" src="http://backticket.com.ua/Img/addNew.jpg" onmouseover="ShowMenu();" onmouseout="HideMenu();" />
</td>
<td>
Some text that should be under appeared menu
</td>
</tr>
<tr>
<td colspan="2">
Some text that Some text that Some text that
</td>
</tr>
</table>
<div id="divMenu" style="display:none; width: 258px; padding: 8px 0px; border: solid 1px #CCC; background-color:White">
<div style="float: left; width: 140px; padding: 6px 2px;">
<a href="javascript:window.print();">Print Page</a>
</div>
<div style="float: left; width: 140px; padding: 6px 2px;">
<a href="#" onclick="return showEmailToFriendPopup();" class="vi_link">Email to a Freind</a>
</div>
<div style="float: left; width: 140px; padding: 6px 2px;">
<a href="#">Add to Favorites</a>
</div>
</div>
<script type="text/javascript">
function ShowMenu() {
document.getElementById('divMenu').style.display = '';
}
function HideMenu() {
document.getElementById('divMenu').style.display = 'none';
}
</script>
</body>
</html>
I need to show a menu in hidden div next to the button (in the right side) over the other text and elements on the page. Also menu should be visible until mouseout of the button or menu, like on hover button in AddThis service.
Who can help me with javascript?
Thanks!
Put a div-tag around your table, give it the CSS style value "float: left". Then, you give "divMenu" the CSS style value "float: right".
The rest seems to be working fine, at least in Firefox.
加载中,请稍侯......
精彩评论