jQuery onmouseover + onmouseout /悬停在两个不同的div上 [英] jQuery onmouseover + onmouseout / hover on two different divs

问题描述

我有一个问题：

这里是我的HTML的一部分：

 < div id =div_1> 
这里悬停
< / div> 
< div id =div_2> 
此处显示
< / div>的内容
  

这里是我的jQuery脚本的一部分：

  jQuery的（ '＃div_2'）隐藏（）; 
 jQuery（'＃div_1'）。onmouseover（function（）{
 jQuery（'＃div_2'）。fadeIn（）; 
}）。 b jQuery（'＃div_2'）。fadeOut（）; 
}）; 
  

问题：

在div_1上显示div_2，如果我将鼠标悬停在外，div_2被隐藏，但是：如果我首先在div_1上悬停，然后再转过div_2，那么div_2隐藏得很快。

我试过用jQuery.addClass（）;

我不想在第一个div中创建第二个div ...有没有另一种方式使用jQuery？

>

Thx Ahmet

解决方案

这是另一种方法， （b）
$ b $ $ $ $ $''$ $ $ $'$ div $' ）.hide（）;
$（'＃div_1，＃div_2'）。hover（function（）{
$（'＃div_2'）。stop（）。fadeIn（）;
），function（）{
$（'＃div_2'）。stop（）。fadeOut（）;
}）;
}）;

I've got a Problem:

Here a part of my HTML:

<div id="div_1">
    Here Hover
</div>
<div id="div_2">
    Here content to show
</div>

And here a part of my jQuery Script:

jQuery('#div_2').hide();
jQuery('#div_1').onmouseover(function() {
    jQuery('#div_2').fadeIn();
}).onmouseout(function(){
    jQuery('#div_2').fadeOut();
});

The Problem:

If i hover on the div_1, the div_2 is shown, if i hover out, the div_2 is hidden, but:

If i hover first on div_1 and then go over div_2, the div_2 is hidden fast.

I've tried this with jQuery.addClass(); after mouseout in div_1, but nothing is changing.

I dont want do make the second div in the first div... Is there another way with jQuery?

Thx Ahmet

解决方案

Here's another approach, just apply the hover to the second div as well so it stops itself being hidden:

$(function() {
  $('#div_2').hide();
  $('#div_1, #div_2').hover(function() {
      $('#div_2').stop().fadeIn();
  }, function(){
      $('#div_2').stop().fadeOut();
  });
});

这篇关于jQuery onmouseover + onmouseout /悬停在两个不同的div上的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！