Popup-Div-Anker bei mouse-hover/Klick
Ich bin neu in Web-Programmierung.
Ich will etwas umsetzen, wie in facebook, wenn wir schweben unsere Maus über den link, ein Pfeil-floating-div, der Anker auf den der link zeigte auf es.
Wie Sie alle Adressen, die Art der Komponente? Die nächstgelegene Bibliothek, die ich gefunden habe ist http://gristmill.github.com/jquery-popbox/ funktioniert Das nicht, irgendwann, in einigen browser. Weitere Suche nach "Popbox" zeigt keine brauchbares Ergebnis. Kann jemand empfehlen, eine ähnliche Bibliothek, wie der link, den ich gepostet? Es kann mit Jquery, Javascript, CSS, html oder etc.
Anstelle von Bibliothek, kann jemand mir zeigen, wie tun Sie es, ohne mit Bibliothek, in einer einfachsten Weise. Ich möchte nur wissen, die grobe Idee dahinter. Die meisten die Bibliothek kommen, mit komplizierten code, ist schwer zu lernen für Anfänger.
Danke sehr viel im Voraus.
- +1 für den Wunsch, es zu lernen 🙂
Du musst angemeldet sein, um einen Kommentar abzugeben.
Überprüfen Sie diese arbeiten demo: http://jsfiddle.net/fedmich/Aapw6/
Müssen Sie erstellen ein Bild der Pfeiltaste nach oben und zentriert in der popup-box, und dann in der Regel verschieben sich die popup-box, um dem Ziel zu Folgen verankern.
CSS-code sollte position absolute
man könnte dies über die Positionierung des Ziel-div und dann immer die Mitte, die durch Division der Breite um die Hälfte und indem es auf der linken Seite.
lassen Sie mich Ihnen einige der Geige für diese kurz
auf einer anderen Anmerkung, obwohl, haben Sie versucht, die hovercards? vielleicht ähnlich zu dem, was Sie tun möchten
http://designwithpc.com/Plugins/Hovercard
jquery ui bietet eine dialog Funktion
die Idee dahinter, dass Sie Ihre Anker zu binden, die es zeigt und verbirgt Sie popup -
müssen Sie legen Sie die position des popup zu.
beachten Sie, dass nur, wenn die popup-divs-display nicht none ist, können Sie $('#popup').outerWidth()/2 und $('#Anker').outerWidth() /2 ...