Ein Div mit Link und Rollover versehen
Es kommt öfters die Frage wie man ein Div mit einem Link und einen Rollover versehen kann. Dies ist im Grunde genommen ganz einfach. Im Beispiel nehmen wir einen link zu google.
Ins Template oder ins Modul schreiben wir dies:
<a target="_blank" href="http://google.de" class="google">
Der passende CSS Code ins Template.css oder wo auch immer hin:
.google{float:left;margin:0 10px;height:32px;width:32px;background:url(NORMAL-BILD-URL);}
.google:hover {float:left;margin:0 10px;height:32px;width:32px;background:url(HOVER-BILD-URL);}
In diesem Fall hat das Bild eine Breite und Höhe von 32Pixel. Müsste ggf. angepasst werden. Float Left bewirkt, das die Bilder wenn es mehrere sind, nebeneinander dargestellt werden. Der margin:0 10px bewirkt einen Abstand oben & unten von 0 Pixel und einen Abstand links und rechts von 10 Pixel.
Bleibe auf dem laufenden
Blog Archiv
Blog Kategorien
- Allgemein Themen (30)
- Suchmaschinenoptimierung (3)
- Joomla Template Anbieter (0)
- Sonstige (1)
- JoomlArt (2)
- AtJoomla (0)
- HOT Joomla (0)
- JoomlaXTC (0)
- JoomSpirit (0)
- ENYtheme (0)
- Cmslounge (0)
- Rocket Theme (0)
- Pixel Point Creative (0)
- Joomlage (0)
- JoomlaPraise (0)
- Gavick Pro (9)
- Yootheme (2)
- Templateplazza (0)
- Shape5 (0)
- iTemplater (0)
- Joomla51 (0)
- Atict (0)
- Yagendoo (0)
- olwebdesign (0)
- Pixels Paradise (0)
- Joomla Designs (0)
- YouJoomla (0)
- JoomlaPlates (0)
- JoomlaTD (0)
- Veero (0)
- PickJoomla (0)
- MixWebTemplates (0)
- Pure Joomla (0)
- Joomla Monster (0)
- SiteGround (0)
- JoomlaBamboo (0)
- Template Monster (0)
- JoomlaShack (0)