+- MyBB.de Forum (https://www.mybb.de/forum)
+-- Forum: Anpassungen (https://www.mybb.de/forum/forum-47.html)
+--- Forum: Theme-Diskussionen (https://www.mybb.de/forum/forum-84.html)
+--- Thema: Bilderlinks mit hover erst mit hover sichtbar (/thread-5651.html)
Seiten:
1
2
RE: Bilderlinks mit hover erst mit hover sichtbar - Jan - 21.04.2007
Bei mir werden sie geladen.
Aber benutzte lieber diesen Code:
Code:
<style>/* Buttons */
a.menu{
background: url(deine_grafik.gif) no-repeat left top;
width: 50px;
height: 50px;
text-decoration: none;
}
a.menu:hover{
background-position: 0px -50px;
}
</style>
<div class="menu" >
<a href="index.php" class="menu">Home</a>
</div>Du musst nur deine beiden Bilder als ein Bild zusammenlegen, untereinander.
Näheres kannst du auch hier lesen.
RE: Bilderlinks mit hover erst mit hover sichtbar - modercol - 21.04.2007
Da muss ich dann mkal rumfragen, wenn meine Test Phase vorbei ist und ich das Forum wieder freigebe.
RE: Bilderlinks mit hover erst mit hover sichtbar - Jan - 21.04.2007
Hab meinen Post geändert, les ihn dir nochmal durch.
Diese Frage ist jetzt nicht böse gemeint, aber warum änderst du es nicht einfach in CSS? Was hindert dich daran? Ich wunder mich gerade, warum du nicht eine bessere Lösung annehmen möchtest? O_o
RE: Bilderlinks mit hover erst mit hover sichtbar - modercol - 30.06.2007
gut, ich hab mich jetzt doch entschlossen CSS her zu nehmen.
Einmal auch wegen Validations Problemen.
Allerdings verwirrt mich deine Seite auch etwas Jan. Auch in dem Punkt, das meine Grafiken nicht untereinander sondern nebeneinander dargestellt werden sollen.
Ich bräuchte also einen Code mit <a href> und CSS, sodass die Grafiken nebeneinander dargestellt werden?
Bei deinem oberen Beipsiel, sehe ich auch kein Code, der das hover-Bild einfügt.
RE: Bilderlinks mit hover erst mit hover sichtbar - Jan - 30.06.2007
Bist leider nicht mehr in ICQ,
das Bild das ohne Hover angezeigt wird, und das Bild das mit Hover angezeigt werden solle, müssen in einem Bild sein. Also beide in einer datei. Untereinander.
Dann wird beim laden der Seite das gesamte Doppelbild geladen.
Und wenn du mit der Maus drüber fährst, wird das Bild automatisch um 50px nach unten gescrollt. Es ist dann der teil des Bildes zu sehen, der dein Hoverbild war.
Soweit verstanden?
RE: Bilderlinks mit hover erst mit hover sichtbar - modercol - 30.06.2007
Wusst ichs doch: Da erscheint kein Bild bzw. des is zu klein trotz genauer CSS-Angabe. Mal die CSS:
Code:
a.home{
background:url(images/but111.png) no-repeat left top;
width:60px;
height:80px;
text-decoration: none;
}
a.home:hover{
background-position: 0px -40px;
}PHP-Code:
<div style="margin-top:120px; margin-left:45px; padding:0px; ">
<a href="index.php" class="home"> </a>
...
</div>
RE: Bilderlinks mit hover erst mit hover sichtbar - Jan - 30.06.2007
Ersetzte:
Code:
</head>
<body>
<div class="head">
<a href="http://www.x-jokepage.de.vu" title="Jokes,Jokes,witze... x-jokepage.de.vu" class="linktop">x-jokepage</a><!-- | <a href="http://www.casemod.de.gg" title="Tipps und Fotos für casemoder" class="linktop">casemod</a> -->
<div style="position:absolute; top:5px; left:880px; z-index:0; ">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" type="application/x-shockwave-flash" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="120" height="120">
<param name="movie" value="Analog_Uhr_VS_04.swf" />
<param name="quality" value="high" />
<param name="BGCOLOR" value="#ffba5e" />
<param name="MENU" value="false" />
</object>
</div>
<div style="margin-top:120px; margin-left:45px; padding:0px; ">
<a href="index.php" class="home"> </a>Code:
<style>
#homelink, #homelink a {
width:60px;
height:40px;
background:red url(images/but111.png)left top no-repeat;
text-decoration: none;
float:left;
}
#homelink a:hover{
background-position: 0px -40px;
}
</style>
</head>
<body>
<div class="head">
<a href="http://www.x-jokepage.de.vu" title="Jokes,Jokes,witze... x-jokepage.de.vu" class="linktop">x-jokepage</a><!-- | <a href="http://www.casemod.de.gg" title="Tipps und Fotos für casemoder" class="linktop">casemod</a> -->
<div style="position:absolute; top:5px; left:880px; z-index:0; ">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" type="application/x-shockwave-flash" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="120" height="120">
<param name="movie" value="Analog_Uhr_VS_04.swf" />
<param name="quality" value="high" />
<param name="BGCOLOR" value="#ffba5e" />
<param name="MENU" value="false" />
</object>
</div>
<div style="margin-top:120px; margin-left:45px; padding:0px; ">
<div id="homelink">
<a href="index.php"></a>
</div>Die Funktionsweise sollte verstanden sein.
Musst nur jeden Button einzeln definieren.