Mantener abierto el elemento jQuery `anexado cuando se desplaza

YA SE HA RESPONDIDO A MI MISMO (Ver respuestas)

Así que al comenzar desde jQuery `[jQuery created Element] .is (“: hover “)` Solo parece funcionar en Chrome .

Un poco más de fondo :
Estaba tratando de mantener el desplazamiento cuando pasamos de un elemento que ya estaba en el DOM a un elemento agregado por el método .append() jQuery.

Estaba usando .is(":hover") . Este método funcionaba bien en Chrome pero no en otros navegadores. Como descubrimos (del enlace anterior) se eliminó hace algún tiempo.

ANTIGUO: METODO HOVER

 var hov = $("
I'm Over You
"), box = $("
Result: WAITING
") $("body").append(hov).append(box); $("#MeHover").on('mouseleave', function(){ var d = new Date(); box.text("Result: " + hov.is(":hover").toString().toUpperCase() ); });

En el oyente de la mouseleave , mantenga abierto si el elemento hoverer o hoverer es el relatedTarget

 var $hovered = $('#MeHover'); var $hoverer = $("
I'm Over You
"); $("body").append($hoverer); $hovered.add($hoverer).mouseenter(function() { $hoverer.fadeIn(); }).mouseleave(function(e) { if (e.relatedTarget != $hoverer[0] && e.relatedTarget != $hovered[0]) $hoverer.fadeOut(); });
 .over { display: none; position: absolute; top: 20px; left: 0; right: 0; background: green } 
  
Hover Over Me

Así que jugué con rastrear el mouse y ver si estaba en el contenedor, pero parecía demasiado caro y complejo de implementar. Al final, decidí ir por la ruta .data() como se muestra a continuación.

También tengo un violín que demuestra: https://jsfiddle.net/glenn2223/uk7e7rwe/

CÓDIGO

 var hov = $("
I'm Over You
"), box = $("
Result: WAITING
"); $("body").append(hov).append(box); $("#MeHover").add(hov).mouseenter(function () { $("#MeHover").data("keepHover", 1); hov.fadeIn(); }).mouseleave(function () { $("#MeHover").removeData("keepHover"); CloseHover(); }); function CloseHover(){ clearTimeout(t); var t = setTimeout(function () { if ($("#MeHover").data("keepHover") != 1) hov.fadeOut(); }, 300); }