info-bulle à suivre jquery slider handle?

Je me demandais si il serait possible de joindre une bulle d'aide de la poignée du curseur? Mon actuelle du curseur de la fonction est:

            $('#slider').slider({
                max: 18,
                animate: 'slow',
                orientation: 'vertical',
                slide: function(e,ui) {
                    $('#storage').html(storage[ui.value-1]);
                    $('#ram').html(ram[ui.value-1]);
                    $('#bandwidth').html(bandwidth[ui.value-1]);
                    $('#cpu').html(cpu[ui.value-1]);
                    $('#price').html(price[ui.value-1]);
                }
            });

Je veux profiter de cette et appliquer une info-bulle à suivre la poignée. Serait-il recommandé de faire en quelque sorte déterminer la position et la dynamique de mise à jour de l'info-bulle position sur la base de la position du curseur?

Que voulez-vous afficher dans l'info-bulle?
Glissez-moi! est ce que je veux afficher.

OriginalL'auteur Steven | 2010-06-30

  1. 15

    En fait l'utilisation de l'attribut title est la façon la plus facile ( belugabob idée)

    $(function() {


  $("#slider").slider()
                .find(".ui-slider-handle")
                .attr("title", "Slide Me")

});

    Cependant, si vous voulez le plein contrôle sur l'utilisation de cet échantillon

    Aperçu: http://jsbin.com/eluqi3/166/edit

    $(function() {

  var $slideMe = $("<div/>")
                    .css({ position : 'absolute' , top : 10, left : 0 })
                    .text("Slide Me!")
                    .hide()


  $("#slider").slider()
                .find(".ui-slider-handle")
                .append($slideMe)
                .hover(function()
                        { $slideMe.show()}, 
                       function()
                        { $slideMe.hide()}
                )

});
    Alors que j'aime votre solution, je ne suis pas convaincu que l'info-bulle doit être visible pendant toute la durée de la glisse. À l'aide d'un navigateur natif d'info-bulle, il ne s'affiche que pour peu de temps après la souris, saisissez la poignée du curseur. Tout est une question de goût, je suppose.
    Suppose que vous êtes en droit - il simplifie également le code 😉
    mon but était d'intégrer une sorte de nice css info-bulle. Est-ce possible? Ou seulement à l'aide de l'attribut title?
    voir mon édité répondre

    OriginalL'auteur jantimon

  2. 1

    Juste au sujet de n'importe quel élément HTML peut être affecté à une info-bulle en lui donnant un attribut "title" avec la requred texte étant la valeur de l'attribut.

    Dans le cas de votre curseur, vous pouvez de manière fiable localiser l'élément HTML utilisé pour tirer la poignée du curseur?
    Si oui, il suffit d'ajouter un attribut title et vous devriez être en affaires.

    EDIT:
    Juste que d'un point de vue général, l'utilisation judicieuse de l'attribut title peut rendre vos pages web plus propre - par l'ajout d'informations qui est sensible au contexte, vous ne prenez pas d'écran de l'immobilier jusqu'à ce qu'il est réellement nécessaire, et d'aider ceux qui ne sont pas familiers avec l'INTERFACE utilisateur de votre site.

    Je suis juste essayer d'imaginer ce qu'une info-bulle dans une poignée coulissante ressemblerait et je ne peux pas le voir en ajoutant à l'expérience de l'utilisateur d'une manière significative. Il pourrait en fait être préjudiciable, surtout si, par inadvertance, il couvre la valeur actuelle du curseur.
    Vrai, et c'est l'avantage de la technique - il n'y a plus de contrôle sur la position de l'info-bulle. Ma principale préoccupation est que le but de l'info-bulle est de demander à l'utilisateur inexpérimenté et de les informer de l'utilisation de la poignée du curseur. Une fois qu'ils ont commencé à glisser, l'info-bulle est redondant.

    OriginalL'auteur belugabob