Bilder mit Sprechblasen [IE|M|O]

von: Werner Zenk

Diese JavaScript-Funktion zeigt Sprechblasen über Bilder an.

Quelltext:

<script type="text/javascript">
function anzeigen(das){
 if(document.getElementById(das).style.display=="none") {
  document.getElementById(das).style.display="inline";
 }
 else {
  document.getElementById(das).style.display="none";
 }
}
</script>

<style type="text/css">
.bereich {
 position: absolute;
}

.beschreibung {
 color: #76835F;
 background-image: url(ausruf.gif);
 background-repeat: no-repeat;
 width: 171px;
 height: 110px;
 position: relative;
 left: -15px;
 display: block;
 padding-top: 5px;
 padding-left: 25px;
 padding-right: 5px;
}
</style>

</head>
<body>

<!-- Erstes Bild -->
<img src="bild1.gif" onMouseover="anzeigen('text1');"  onMouseOut="anzeigen('text1');">
<span class="bereich" style="display: none;" id="text1">
 <div class="beschreibung">Beschreibung 1</div>
</span>

&nbsp; &nbsp; &nbsp; &nbsp; 

<!-- Zweites Bild -->
<img src="bild2.gif" onMouseover="anzeigen('text2');" onMouseOut="anzeigen('text2');">
<span class="bereich" style="display: none;" id="text2">
 <div class="beschreibung">Beschreibung 2<br></div>
</span>

   = Text-ID


ausruf.gif
171 x 110 Pixel
1,02 KB


ausruf2.gif
170 x 109 Pixel
1,26 KB


ausruf3.gif
169 x 108 Pixel
1,09 KB

Eventuell muß die CSS-Anweisung ".beschreibung" den Sprechblasen angepasst werden!

Siehe auch:

Bilder mit "Zoom"-Funktion

Und Ihre Meinung? Sie vermissen auf dieser Seite wichtige Informationen oder haben Hinweise für uns?

Kommentare: 10 » aufmachen Sebastian: Super Effekt! Endlich mal ein Tooltip, der klein ist und auch gut aussieht!Danke mfg Sebastian Jutta: Gefällt mir gut...Danke SPEED: Hi ich bin Speed und finde eure Seite eigentlich ganz gut habe mich aber noch nicht so viel umgeschaut aber das mache ich dafür jetzt!!Viel Spaß noch mit der Seite Marion: Gefällt mir gut, nette Spielerei...hmmm gibts sowas auch für Buttons, für eigen erstellte mit Grafikprogramm?LGMarion torsten: find ich cool, gefällt mir Schwarzi: nach sowas hab ich schon eewig gesucht aber nie was derartiges gefunden...danke! die seite is einfach cool...immer wieder findet man was nützliches =) weiter so Feri: Vielen Dank! Einfach und Genial! Moritz: Das habe ich die ganze Zeit gesucht!!Dankeschön Lukas: Wow, ich hätte nicht gedacht, dass so etwas möglich ist! Es lebe Javascript! René: genau das was ich gesucht hab. superklasse. und gleich verwendet...danke.......rechtherzlichen dank...
Hilfe finden Sie im » netzgemein.de - Forum. Auch als „Gast” können Sie dort Fragen stellen!

Das könnte Sie interessieren:

Counter - Hier finden Sie einen Counter der die Stunden, Minuten und Sekunden von einer vorher festgelegten Zeit abzählt.

Formular-Ziel ändern - Mit diesen Script ist es möglich, das Ziel eines Formulars nach belieben zu ändern.

Umleitung mit JavaScript - Ein kleines Script stellt fest, ob der Browser des Besuchers ...

Bildinformationen - Beim überfahren des Bildes mit der Maus, werden die Bytegröße, Bildbreite, Bildhöhe und die Bildadresse angezeigt.

Rechtsklick Schutz - Die rechte Maustaste wird gesperrt, und eine Meldung wird ausgegeben.

JavaScript Grundkurs - 5. Ein- und Ausgaben

Die aktuelle Position ermitteln - Das Script ermittelt die aktuelle Position des Mauszeigers.

Zeitansage in JavaScript

Neues Fenster

Blinkender Text

JavaScript über dem Form-Tag aufrufen - Nach dem drücken der Eingabetaste (Return-Taste) wird ein JavaScript aufgerufen. …mehr