Suche im Forum:
Suchen


« Vorheriges Thema anzeigen :: Nächstes Thema anzeigen »  
Autor Nachricht
Beitrag24.09.2012 um 16:23 (UTC)    
Titel: info bei Text

Hallo, ich möchte dne Text "Behrühre mich" in meine Seite einfügen, und beim Überfahren mit der Maus wird eine kleine Info mit dem Text: Dies ist ein Windrad" angezeigt.
Mit welchem Code kann ich das realisieren?

Beispiel: http://unsereklasse-fwe.de.tl/-k1-Klassen-k2-_fotos.htm (wenn man auf "durchsuchen" klickt, erscheint eine kleine Info)
Beitrag24.09.2012 um 17:07 (UTC)    
Titel:

Im Prinzip geht das so:

HTML & JavaScript:
Zitat:
<span class="ttcont" onmouseover="document.getElementById('tooltip1').style.display='inline-block';" onmouseout="document.getElementById('tooltip1').style.display='none';">Berühre mich<span id="tooltip1">Dies ist ein Windrad</span></span>

Zu überfahrender Text
Tooltip-Text

CSS:
Zitat:
span.ttcont{
position:relative;
}
#tooltip1 {
display:none;
width:200px;
position:absolute;
right:-205px;
top:-10px;
}

Hier kannst du die Position und die Breite des sich öffnenden "Fensters" verändern.

Gruß,

TransInt
______________
Kein Support per PN - Im Forum hilft es allen!

Life is what happens while you are busy making other plans.
- John Lennon


Zuletzt bearbeitet von transint am 25.09.2012, 19:48, insgesamt 3-mal bearbeitet
Beitrag24.09.2012 um 17:13 (UTC)    
Titel:

funktioniert bei mir leider nich.
Muss ich den Javascript code vieleicht zwischen 2 html Anweisungen einfügen?
Beitrag25.09.2012 um 16:47 (UTC)    
Titel:

"Funktioniert nicht" ist keine Fehlerbeschreibung!
Wenn man dir helfen soll, musst du so genau wie möglich beschreiben, was du getan hast und was nicht funktioniert.

Also:
Was genau hast du wo eingefügt?

mfg Philipp
______________
Forenregeln, FAQ, Suchfunktion
Beitrag25.09.2012 um 18:09 (UTC)    
Titel:

Ich habe die beiden Codes direkt untereinander und unverändert auf eine Testseite unter der Option "Quellcode" eingefügt, und es wurde der direkte Quellcode und nicht der Text mit der Info angezeigt.

Hier die Testseite (wird bald wieder gelöscht)
https://dl-web.dropbox.com/get/Public/Infotext.htm?w=95a95c93


Zuletzt bearbeitet von unsereklasse-fwe am 25.09.2012, 19:20, insgesamt einmal bearbeitet
Beitrag25.09.2012 um 18:52 (UTC)    
Titel:

Bei deinem Link kommt bei mir eine Fehlermeldung (genaugenommen 403).
Lade doch einfach einen Screenshot im Baukasten hoch oder, noch besser, füge den Code einfach auf deiner Seite ein sodass man sich das anschauen kann.

Übrigens habe ich eine Kleinigkeit geändert. Jetzt sollte es funktionieren.

Edit: Ach ja, um den CSS-Code müssen Style-Tags... Wink
Zitat:
<style type="text/css"> <!--
CSS-Code
//--> </style>


Gruß,

TransInt
______________
Kein Support per PN - Im Forum hilft es allen!

Life is what happens while you are busy making other plans.
- John Lennon


Zuletzt bearbeitet von transint am 25.09.2012, 20:02, insgesamt einmal bearbeitet
Beitrag25.09.2012 um 19:02 (UTC)    
Titel:

mein Code, dne ich eingefügt habe:
Code:
<span class="ttcont" onmouseover="document.getElementById('tooltip1').style.display='inline-block';" onmouseout="document.getElementById('tooltip1').style.display='none';">Berühre mich<span id="tooltip1">Dies ist ein Windrad</span></span>


span.ttcont{
position:relative;
}
#tooltip1 {
display:none;
width:200px;
position:absolute;
right:-205px;
top:-10px;
}


Edit:
hab die Styletags jetzt mal eingefügt, und es geht Danke Very Happy

Thread kann geschlossen werden


Zuletzt bearbeitet von unsereklasse-fwe am 25.09.2012, 20:37, insgesamt einmal bearbeitet
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de