Daher ich oft gefragt wurde wie man diesen Effekt macht, erkläre ich euch das hier einmal. Nun werdert ihr ein Beispiel sehen wie dieser Effekt auch bei dir aussehen kann.
Wie man vielleicht erkennen kann, das kleine Viereck ist ein normales Bild auf der Website (kann natürlich jede größe haben) und wenn man mit der Maus drüberfährt erscheint dann das gewünschte Bild (in meinen Fall eine größere Version des kleinen Viereckes)
Tooltip - Datei + Erklärung
Als erstes braucht ihr die
Tooltip - Datei diese könnt ihr
hier herunterladen. Wenn ihr das gemacht habt dann öffnet sie mit einem Editor, ich verwende hier Dreamweaver 8
(vorgänger Version oder andere Editoren wie Phase5 gehen auch). Dann müsst ihr ein bisschen Scrollen bis ihr dahin kommt was das untere Bild anzeigt.
Hier könnt ihr ändern wie alles aussehen soll. Bei den Bild was nun kommt könnt ihr sehen was ihr durch verändern der Zahlen verändert. Den Rest der anderen Zahlen im oben gezeigten Bild braucht ihr nicht zu beachten es sind nur die
drei Einstellungen wichtig die nun gezeigt werden.
Verwendung
Nachdem ihr alles schön umgeändert habt und abgespeichert habt müsst ihr die Datei nur noch auf euren FTP Server hochladen. Nun müsst ihr den Code nicht in den
<head>-Bereich einfügen, sondern ihr müsst ihn bevor ihr den
<body>-Bereich schließt reinkopieren.
<script type="text/javascript" src="URL zur Tooltip.js-Datei"></script>
Also sieht das ende eurer Website so aus:
Code - </body> - </html>
Wenn ihr das gemacht habt fehlt euch nicht mehr viel ihr braucht dann nur noch folgenden Code:
<a href="#" onMouseOver="this.T_WIDTH=250;return escape(′<img src=′awards/icon_contest.gif′ width=′250′>′)"><img src="awards/prev/icon_contest.jpg" border="0" alt=""></a>
Die erste
URL im Code ist für das Hoverbild und die 2te ist das kleine Vorschaubild.
Ich hoffe ich konnte euch ein bisschen helfen, wenn ihr noch fragen habt stellt sie!
Fr34k
und dann meinen badge nehmen, tz xDDDöhm ja, gutes tut^^