Wie erstellt man Popup-Boxen neben den Links, wenn man mit der Maus darüber fährt?

8

Hier ist was ich implementieren möchte:

Ich habe zwei Hyperlinks, die auf der Webseite angezeigt werden:

%Vor%

und ich habe auch zwei Beschreibungen zu den Links als divs:

%Vor%

Nun, wenn ich mit der Maus über den Link von foo gehe, sollte das entsprechende Beschreibungs-Div auftauchen, und es sollte direkt neben meinem Cursor auftauchen.

Wenn ich mit der Maus über "foo" gehe, sollte ein Popup-Fenster mit "foo means foo" direkt neben dem Mauszeiger erscheinen. Gleiches gilt für "bar".

Bitte zeigen Sie eine schnelle und einfache Möglichkeit, dies zu implementieren, mit Javascript / Jquery, CSS oder einer Kombination dieser.

P.S. Ich entschuldige mich dafür nicht vorher klar zu erklären, ich möchte eigentlich weitere Links oder Bilder in die Beschreibung div anstelle von reinem Text einfügen, so dass ein regelmäßiger Tooltipp vielleicht nicht geht.

Danke.

    
eastboundr 14.05.2012, 16:03
quelle

3 Antworten

13

Hier ist die einfachste Lösung.

HTML:

%Vor%

CSS:

%Vor%

JavaScript:

%Vor%

DEMO: Ссылка

    
VisioN 14.05.2012, 16:16
quelle
5

Haben Sie in diesem Fall erwogen, ein "title" -Attribut zu verwenden?

%Vor%

Sehen Sie, ob dies Ihren Bedürfnissen entspricht.

Wenn Sie die Maus über den Link "foo" bewegen, erscheint neben dem Mauszeiger ein kleines Kästchen mit "foo means foo".

    
Kshitij 14.05.2012 16:08
quelle
0

Verwenden Sie so etwas wie funkytooltipps .

Es gibt jedoch viele andere; nach Dingen wie "jquery link popup" usw. zu suchen, erscheint mehr.

    
Dave Newton 14.05.2012 16:07
quelle

Tags und Links