关于jquery中hover、fadeOut、fadeIn问题
<html><scriptsrc="http://code.jquery.com/jquery-latest.js"></script><script>$('.c').h...
<html>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$('.c').hide();
$('.c').hover
(
function(){$(this).fadeIn();},
function(){$(this).fadeOut();}
)
</script>
<body>
<div class="c">Hello</div>
</body>
</html>
我想鼠标在hello上的时候淡入，离开后淡出，问题淡出就无法淡入！
请求解决方法~ 展开
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$('.c').hide();
$('.c').hover
(
function(){$(this).fadeIn();},
function(){$(this).fadeOut();}
)
</script>
<body>
<div class="c">Hello</div>
</body>
</html>
我想鼠标在hello上的时候淡入，离开后淡出，问题淡出就无法淡入！
请求解决方法~ 展开
3个回答
展开全部
首先，严重声明：隐藏的元素是没法触发鼠标事件的。所以你这想法根本行不通。
其次，你写$('.c').hide();的本意应该是一开始让.c隐藏的，但是这样没法达到预期效果，必须要加载执行这动作才行，所以应该写成$(function(){$('.c').hide();})
<html>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(function(){
$('.c p').hide();
$('.c').hover(
function(){$(this).find('p').fadeIn();},
function(){$(this).find('p').fadeOut();
})
})
</script>
<body>
<div class="c">
<span>Mouse Here</span>
<p>Hello</p>
</div>
</body>
</html>
其次，你写$('.c').hide();的本意应该是一开始让.c隐藏的，但是这样没法达到预期效果，必须要加载执行这动作才行，所以应该写成$(function(){$('.c').hide();})
<html>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(function(){
$('.c p').hide();
$('.c').hover(
function(){$(this).find('p').fadeIn();},
function(){$(this).find('p').fadeOut();
})
})
</script>
<body>
<div class="c">
<span>Mouse Here</span>
<p>Hello</p>
</div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
你这段什么代码啊！ 为什么要先隐藏？ 隐藏之后这个div在页面中是相当于不存在的，你后面定义的函数等于是没有意义的！
其二、fadeOut函数你自己可以firebug检测这个元素是怎么实现fadeOut，fadeOut就是简单来说"display:none",这样子的话跟hide（）方法是差不多的，display:none在页面上你是查看不到这个元素的。所以没有办法实现这个功能
其二、fadeOut函数你自己可以firebug检测这个元素是怎么实现fadeOut，fadeOut就是简单来说"display:none",这样子的话跟hide（）方法是差不多的，display:none在页面上你是查看不到这个元素的。所以没有办法实现这个功能
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
楼主把下面的放到html里试试 效果应该就是你说的那个了
另外你的那个hello一定要在div下面在套一个框如<a> <span>等等都可以 直接在div里效果会出问题的
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>test</title>
<script src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.min.js" type="text/javascript"></script>
<script>
$(document).ready(function(){
$('.c').hover(function(){
$(this).children('a').fadeIn();
},function(){
$(this).children('a').fadeOut();
}
);
});
</script>
<style>
div {width:50px;height:30px;border:solid 1px red;}
</style>
</head>
<body>
<div class="c">
<a style="display:none;">Hello</a>
</div>
</body>
</html>
另外你的那个hello一定要在div下面在套一个框如<a> <span>等等都可以 直接在div里效果会出问题的
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>test</title>
<script src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.min.js" type="text/javascript"></script>
<script>
$(document).ready(function(){
$('.c').hover(function(){
$(this).children('a').fadeIn();
},function(){
$(this).children('a').fadeOut();
}
);
});
</script>
<style>
div {width:50px;height:30px;border:solid 1px red;}
</style>
</head>
<body>
<div class="c">
<a style="display:none;">Hello</a>
</div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
