[英]fadeToggle next element in on hover
I have the following code to show the next element in the dom on click, I would like to convert this same code into something I could use for a simple hover event. 我有以下代码来显示点击dom中的下一个元素,我想将这个相同的代码转换为我可以用于简单悬停事件的东西。 Does jQuery have a simple method to do something like this or should I be using
.bind()
to mouseover
and mouseout
events? jQuery有一个简单的方法来做这样的事情,还是我应该使用
.bind()
来mouseover
和mouseout
事件? I know this should be simple, I am probably just not thinking clearly. 我知道这应该很简单,我可能只是没有想清楚。
$('#el').click(function(e){
e.preventDefault();
var $prevEl = $(this).parent().find('.prev-el');
$prevEl.fadeToggle();
});
One thing to mention is I would like the $prevEl
to stay visible after hovering the triggering #el
element. 有一点需要提及的是,我希望
$prevEl
在悬停触发#el
元素后保持可见。 What is the best way to go about this? 最好的方法是什么?
Thank you in advance, 先感谢您,
DT DT
You can use $('#el').mouseover(...
instead of $('#el').click(...
, but you should use fadeIn
instead of fadeToggle
when you're using mouseover
: 您可以使用
$('#el').mouseover(...
而不是$('#el').click(...
,但是当你使用mouseover
时你应该使用fadeIn
而不是fadeToggle
:
$('#el').mouseover(function(e) {
var $prevEl = $(this).parent().find('.prev-el');
$prevEl.fadeIn();
});
http://jsfiddle.net/mblase75/eXjTb/3/ http://jsfiddle.net/mblase75/eXjTb/3/
If you want it to fade back out on mouseout, though, use .hover
as a shorthand way to combine the two and keep the fadeToggle
: 但是,如果你希望它在mouseout上淡出,请使用
.hover
作为一种.hover
方法来组合两者并保持fadeToggle
:
$('#el').hover(function(e) {
var $prevEl = $(this).parent().find('.prev-el');
$prevEl.fadeToggle();
});
http://jsfiddle.net/mblase75/eXjTb/2/ http://jsfiddle.net/mblase75/eXjTb/2/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.