javascript - Issue with a mouse wiggle effects -
i have written code display small panel when mouse on regions, ended terrible "wiggle" effect when insert image. how can fix that?
have @ my codepen. relevant excerpt:
$('.italia g').mouseover(function (e) { var region_data = $(this).data('region'); $('<div class="info_panel">' + '<img src=" ' + region_data.region_image + ' " >' + '</div>' ).appendto('body'); }) .mouseleave(function () { $('.info_panel').remove(); }) .mousemove(function(e) { var mousex = e.pagex, //x coordinates of mouse mousey = e.pagey; //y coordinates of mouse $('.info_panel').css({ top: mousey - 100, left: mousex - (($('.info_panel').width()/2)+175) }); });
the issue info window right below cursor when hovering area. infowindow appears, mouse triggering mouseleave event, hovering area , infowindow, above area.
check using this:
$('.info_panel').css({ top: mousey - 100, left: mousex - (($('.info_panel').width()/2)+175) });
no wiggle effect anymore.
Comments
Post a Comment