jQuery vuelo estacionario sigue provocando a cabo
-
19-09-2019 - |
Pregunta
Tengo el siguiente problema. Estoy trabajando en una simple información sobre herramientas jQuery y ahora estoy tratando con algo extraño para mí. Cada vez que el elemento de paso del ratón, puntero del ratón sobre eventos para ratón y se activan a cabo tanto - por lo que la información sobre herramientas desaparece (pero si sigo mano sobre, lo hace mucho de parpadeos en una seg). Ahí está mi código.
var hint = $('<div id="hint-wrap"><div id="hintbox-top"><div id="hintbox-bottom"><div id="hintbox-topleft"><div id="hintbox-bottomleft"><div id="hint-innerwrap"><div id="hint"></div></div></div></div></div></div></div>'); // Funny I know :-D
hint.hide();
$('body').append( hint ); // I append it
$('.hashint').hover(function(e){
// Set position to cursor's
hint.css( 'left', e.pageX );
hint.css( 'top', e.pageY - 60 );
// animated append
hint.css( 'opacity', 0.2 );
hint.show();
hint.animate( { 'opacity' : 1 }, 100 );
// set text
$( "#hint" , hint).html( $( '#' + $(this).attr( 'id' ) + '-hint' ).html() );
},
function(){ // there is the problem
hint.hide();
});
Y el código HTML:
<div id="usernamelabel-hint" class="hinttext">Lorem Ipsum is simply dummy text of the printing and type.Lorem. <a href="#">Sign up!</a></div> <!-- This is hint text (and code) -->
<p><label><span class="hashint" id="usernamelabel">Username</span><span class="asterisk">*</span></label> <!-- ... stuff --> </p>
Por favor, ¿alguien sabe por qué el evento de ratón a cabo todavía está desencadenando y ocultar mi caja?
Muchas gracias, Ondrej
Solución
podría ser, que su información sobre herramientas-div es la superposición de su disparador-div? En ese caso el que aparece información sobre herramientas-div desencadena la mouseleave del gatillo-div .. Por lo menos eso es lo que sucedió a mí hace algunos divs. He resuelto este problema mediante la superposición de todo con un invisible gatillo div - no es tan bonito, pero trabajó para mí ..
Otros consejos
En primer lugar, ¿por qué no acaba de poner el código HTML de la pista en el documento HTML?
Y en el CSS que acaba de configurar la pantalla: ninguno
Luego, cuando muestra la pista, sólo se puede utilizar hint.show
o hint.fadeIn
.
Yo sólo usaría $ .mouseenter y $. mouseleave .
Ejemplo:
$.('#usernamelabel-hint').mouseenter(function() {
// show or fade inn hint text
});
$.('#usernamelabel-hint').mouseleave(function() {
// Hide or fade out hinttext
});