
关于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上的时候淡入,离开后淡出,问题淡出就无法淡入!
请求解决方法~ 展开
展开全部
首先,严重声明:隐藏的元素是没法触发鼠标事件的。所以你这想法根本行不通。
其次,你写$('.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>
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询