按钮旁边的 Div 菜单
我有简单的 html 页面：
<html>
<head></head>
<body>
<table>
<tr>
<td>
<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>
我需要在页面上其他文本和元素上方的按钮（右侧）旁边的隐藏 div 中显示一个菜单。此外，在鼠标移出按钮或菜单之前，菜单应该可见，就像 AddThis 服务中的悬停按钮一样。
谁能帮助我使用 JavaScript？
谢谢！
I have simple html page:
<html>
<head></head>
<body>
<table>
<tr>
<td>
<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!
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
在表格周围放置一个 div 标签，并为其指定 CSS 样式值“float: left”。
然后，为“divMenu”指定 CSS 样式值“float: right”。
其余部分似乎工作正常，至少在 Firefox 中是这样。
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.