Any HTML tags inside the tooltip cause the main tooltip to close when hovering

I am new to jQuery, actually any AJAX / JavsScript (although not new to PHP, xHTML and CSS). Anyway, I'm trying to achieve a β€œtooltip” effect where I can hover over a div ... a new div disappears above it, and then when I exit the div, the tooltip disappears.

So, here is the main jQuery that I managed to put together by reading the odd reference here and there:

$(function()
{
    $('#sn-not-logged-in').hover(function()
    {
        $('#sn-not-logged-in-hover').fadeIn('medium');
    });

    $('#sn-not-logged-in-hover').mouseout(function()
    {
        $('#sn-not-logged-in-hover').fadeOut('medium');
    });

});

The problem is that I put the β€œany” html tag inside the div that is hovering over it, and the second you roll it back and the div disappears.

Any ideas how this can be fixed?

Greetings.

+3
1

mouseleave mouseout mousenter hover, , :

$(function() {
  $('#sn-not-logged-in').mouseenter(function() {
    $('#sn-not-logged-in-hover').fadeIn('medium');
  });
  $('#sn-not-logged-in-hover').mouseleave(function() {
    $('#sn-not-logged-in-hover').fadeOut('medium');
  });
});

.hover() , :

$(function() {
  $('#sn-not-logged-in').hover(function() {
    $('#sn-not-logged-in-hover').fadeIn('medium');
  }, function() {
     $('#sn-not-logged-in-hover').fadeOut('medium');
  });
});

.hover() mouseenter mouseleave ( , , ), fadeIn() .

mouseout , mouseenter, .hover() . , ... <img> , :)

+5

Source: https://habr.com/ru/post/1745698/


All Articles