Nar*_*ana 13 html jquery sitedesign
我在extratorrent网站上遇到了mouseover事件,如下图所示.
alt text http://img3.imageshack.us/img3/4516/usercommment999.jpg
当您将鼠标悬停在用户名链接上时,它会显示一个隐藏的div.非常整洁和光滑.
我是jQuery的新手.任何人都可以告诉我如何开始在正确的轨道上做到这一点？谢谢.
更新1:
I wrote something like the following attempting to get the result. The problem is that when I mouse the mouse out the link the Div wont stay, it disappear immediately.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$("#show_div").mouseover(function() { $("#hello").css('visibility','visible'); });
$("#show_div").mouseout(function() { $("#hello").css('visibility','hidden'); });
});
</script>
</head>
<body>
<a id="show_div" href="#">Link text</a>
<div id="hello" style="visibility:hidden;">
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
</div>
</body>
</html>
What to do to make Div stay visible when mouse over the Div?
Ang*_*Wat 12
鼠标悬停在链接文本上时,将div"hello"的Visiblility设置为visible.然后在鼠标悬停div"hello"时,您还将div"hello"可见性设置为可见.在鼠标输出div"你好"时,你将其可见性设置为"隐藏".像这样的东西:
$("#show_div").mouseover(function() { $("#hello").css('visibility','visible'); });
$("#hello").mouseover(function() { $("#hello").css('visibility','visible'); });
$("#hello").mouseout(function() { $("#hello").css('visibility','hidden'); });
你可以使用.hover函数：
$(function() {
$('#divOne').hover(function() {
$('#divTwo').show();
}, function() {
$('#divTwo').hide();
});
});
你有两个 div：
<div id="divOne">div one</div>
<div id="divTwo" style="display: none;">div two</div>
更新：
如评论部分所述，如果鼠标离开第一个 div，则第二个 div 将消失。有许多插件可以让您实现所需的行为。这个特别好看。
| 归档时间： |
|
| 查看次数： |
47731 次 |
| 最近记录： |