Eventos de dos clics para las burbujas de voz

Question

tengo un problema con jQuery y la función de hacer clic. Quiero editar un complemento de burbuja de voz de "http://gdakram.github.com/JQuery-Tooltip-Plugin". Aquí puede ver, si coloca el mouse sobre el botón, abre un bocadillo de diálogo. Quiero esta función con clics, no con mouseover. Mi problema es que este guión es demasiado complicado para mí ... esto es una parte (el JS-datos) desde el sitio web:

(function($) { 

$.fn.tooltip = function(settings) { 
// Configuration setup 
config = { 
'dialog_content_selector' : 'div.tooltip_description', 
'animation_distance' : 50, 
'opacity' : 0.85,*/ 
'arrow_left_offset' : 70, 
'arrow_top_offset' : 50, 
'arrow_height' : 20, 
'arrow_width' : 20, 
'animation_duration_ms' : 300, 
**'event_in':'click',** 
'hover_delay' : 0, 
**'event_out': 'click',** 
}; 

en el evento y el evento fuera no trabajaban juntos ... alguna idea, lo ¿puedo?

Answer 1

En esto son escribir un código para mostrar y ocultar la punta de la herramienta a través del ratón una y ratón fuera modo que el clic no funciona por favor, intente con este

click for tooltip show 
mousemove for tooltip hide 

(function($) { 

    $.fn.tooltip = function(settings) { 
    // Configuration setup 
    config = { 
    'dialog_content_selector' : 'div.tooltip_description', 
    'animation_distance' : 50, 
    'opacity' : 0.85,*/ 
    'arrow_left_offset' : 70, 
    'arrow_top_offset' : 50, 
    'arrow_height' : 20, 
    'arrow_width' : 20, 
    'animation_duration_ms' : 300, 
    'event_in':'click', 
    'event_out':'mousemove' 
    }; 

event_out puede ser 'mousemove' o "mouseleave'

Answer 2

»'event_in': 'mouseover', 'event_out': 'click'« parece bonito, pero no perfecto ... aparece antes de que pueda cerrarlo con el evento click ... eso es un poco ... "feo" ... perdón por las circunstancias.

Answer 3

if (settings) $.extend(config, settings); 

    /** 
     * Apply interaction to all the matching elements 
     **/ 
    this.each(function() { 
     var hoverTimer; 
     $(this).bind(config.event_in,function(){ 
     _hide(this); 
     var ele = this; 
     hoverTimer = setTimeout(function() { _show(ele); }, config.hover_delay) 
     }) 
     .bind(config.event_out,function(){ 
     clearTimeout(hoverTimer); 
     _hide(this); 
     }) 
    }); 

Answer 4

Esto es difícil, pero debería funcionar - construir su propio 'alternar' como método:

config = { 
     'dialog_content_selector' : 'div.tooltip_description', 
     'animation_distance' : 50, 
     'opacity' : 0.85, 
     'arrow_left_offset' : 70, 
     'arrow_top_offset' : 50, 
     'arrow_height' : 20, 
     'arrow_width' : 20, 
     'animation_duration_ms' : 300, 
     '_event_' : 'click' 

     //'event_in':'mouseover', 
     //'event_out':'mouseout', 
     //'hover_delay' : 0 
    }; 

    if (settings) $.extend(config, settings); 

/** 
    * Apply interaction to all the matching elements 
    **/ 

this.each(function() { 

    toggleTip(this); 

}); 

/** 
    * Positions the dialog box based on the target 
    * element's location 
    **/ 

function toggleTip(tip) { 

    var count = 1; 

    $(tip).bind(config._event_, function(e){ 

     e.stopPropagation(); 

     _hide(tip); 

      count++ % 2 ? _show(tip) : _hide(tip); 

    }); 

    }; 

Para que esto sea realmente efectiva que tendría que volver a pensar en la _show() y _hide() funciones.