jquery mouseover, чтобы не скрывать элемент, если мышь находится над всплывающим окном - PullRequest
Новая
       19

jquery mouseover, чтобы не скрывать элемент, если мышь находится над всплывающим окном

0 голосов
/ 24 февраля 2012

У меня мало элементов, и, перемещая мышь на каждом из них, должно появиться всплывающее окно, после того как мышь потратит несколько секунд на каждый из них.Это я сделал следующим скриптом 

var timeOutUserInfo;
$('a[datatype=popupAboutUser]').live({
    mouseenter: function() {
        timeOutUserInfo = setTimeout(function(){
            $('#popupUserInfo').show();
        }, 1000);
        return false;
    },
    mouseleave: function (e) {
        clearTimeout(timeOutUserInfo);
        $('#popupUserInfo').fadeOut(250);
    }
});

, проблема в том, что если пользователь должен навести курсор мыши на #popupUserInfo, но, насколько он это делает, всплывающее окно скрывается.Я попробовал несколько вещей, проверив, находится ли мышь над этим всплывающим окном, а если нет - скрыть его, но не смог этого сделать.

Есть ли для этого какие-либо решения?

1 Ответ

0 голосов
/ 24 февраля 2012

Попробуйте это ... 

<style type="text/css">
a.showinfo{
display:inline-block;
position:relative;
}

div.popupUserInfo{
width:100px;
height:100px;
position:absolute;
right:-100px;
top:0;
display:none;
}
</style>

<a href="whatever.com" class="showinfo">
  <div class="popupUserInfo">some user info here</div>
</a>

<script type="text/javascript">
  $(document).ready(function(){
    $(".showinfo").hover(function(){
        $(this).children(".popupUserInfo").show();
      },function(){
        $(this).children(".popupUserInfo").hide();
    });
  });
</script>
...