jQuery Tippy-Plugin. On Fokus Trigger funktioniert nicht

Ich habe meinen Weg durch jQuery Tooltip Plugins gefiltert und habe beschwipst gefunden. Es wird von GitHub verwendet, darauf basierte ich den größten Teil meiner Entscheidung. Ich mag es wirklich und es ist wirklich einfach zu bedienen.jQuery Tippy-Plugin. On Fokus Trigger funktioniert nicht

Ich habe ein Problem damit. Ich brauche den Tooltip, um im Fokus einzublenden, nicht zu schweben. Es funktioniert derzeit aber nur bei Hover. Hier ist mein aktueller Code:

$('input.tip').tipsy({trigger: 'focus', gravity: 'w', fade: true});

Mit oder ohne trigger: 'hover', macht keinen Unterschied. Ich lese die Dokumente gründlich, damit der Code korrekt ist.

Es ist nicht mit dem HTML/CSS zu tun, ich weiß das für eine Tatsache. Weil es schon funktioniert, nur nicht im Fokus.

Ich benutze jQuery v1.4.4.

Alle Vorschläge würden sehr geschätzt werden, danke.

Ressource: http://onehackoranother.com/projects/jquery/tipsy/

Quelle

2010-11-23 Olical

Das Plugin funktioniert für mich in einem einfachen Testfall basiert auf dem Code, den Sie zur Verfügung stellen. Sind Sie sicher, dass im Zusatzcode Ihrer Seite nichts enthalten ist, was dazu führen könnte, dass dies schief geht?

Meine simple test case zieht das beschwipste Plugin von Github. jsfiddle.net fügt einige zusätzliche Sachen, aber die wichtigen Bits können an folgende HTML reduziert werden, die funktioniert, wenn ich es testen:

<!DOCTYPE html> 
<html> 
<head> 
    <script type='text/javascript' src='http://code.jquery.com/jquery-1.4.4.min.js'></script> 
    <script type='text/javascript' src="https://github.com/jaz303/tipsy/raw/fa497c144ad7d14126a808f4c18a9ba22f2df70f/src/javascripts/jquery.tipsy.js"></script> 
    <script type='text/javascript'> 
    $(function(){ 
     $('input.focustip').tipsy({trigger: 'focus', gravity: 'w', fade: true}); 
     $('input.hovertip').tipsy({trigger: 'hover', gravity: 'w', fade: true}); 
    }); 
    </script> 
</head> 
<body> 
    <p>Test case for <a href="http://stackoverflow.com/q/4258519/445073">stackoverflow question</a>.</p> 
<p>Focus tip: <input class="focustip" title="focus"></input></p> 
<p>Hover tip: <input class="hovertip" title="hover"></input></p> 
</body> 
</html>

ich in Firefox 3.6 und Chrome 8 getestet, sowohl auf Linux.

Quelle

2010-11-23 19:16:25 Day

Hmm, es muss CSS sein, dann benutze ich das Blueprint-CSS-Framework, das könnte es vermasseln. Ich weiß, dass es mit dem Kalender-Plug-in nichts zu tun hat. Danke, dass du es gegeben hast, zumindest weiß ich, dass es jetzt nicht die JS ist. – Olical

Ich hatte gerade das gleiche Problem. Und ich benutze auch das CSS-Framework von Blueprint. Obwohl es sehr wohl etwas damit zu tun haben könnte, ist der Hauptunterschied die Version, die Day verwendete: Er importierte Version 1.0.0a von GitHub, während wir (ich) Version 0.1.7 benutzten.

Anschließen des Tagesbeispiels zu Tipsy v0.1.7 causes the same problem.

Die neue Version hat den Trick für mich getan.

Quelle

2011-07-26 07:23:16

Eine alte Frage, aber eine gute Antwort, gut gemacht, um es auszuarbeiten. Ich bin seitdem zu 960 gegangen, aber ich hoffe, dass dies vielen Menschen hilft. – Olical

Sie haben wahrscheinlich TITLE für das Tag nicht eingegeben.

Quelle

2012-08-20 12:53:57 Nemanja

jQuery Tippy-Plugin. On Fokus Trigger funktioniert nicht

Antwort

Verwandte Themen