Rollover Effekt mit CSS
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
aufgabe
beitrag
bild
dank
doppelte gre
dringend hilfe
gre
herzlichen dank
kstchen
lsen
lsung
meinst
mist
objekt
prinzip
rhrer
test
ups
versuch
-
Hey...also ich hab da son Problem bei CSS...ich hab n Bild, dass soll sich auf mind. die doppelte Größe vergrößern, wenn man da mit der Maus drauf geht.
Ich bekomm es aber nich hin...*argh*...mit Schriften is das kein Problem und mit einfach Kästchen is das auch nich das Theman nur mit diesem Bild werd ich nich feddich...brauch dringend Hilfe. ^^
mfg -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
wie meinst du das, verrgößern?
Da wäre wohl eher JS angebracht, hab ich aber keine Ahung von. Aber erklär mal ein wenig mehr über das Vergrößern ;) -
Ja über JS wäre es einfacher, aber das is ne Aufgabe zu lösen NUR mit CSS...das is n ganz einfaches Rollover.
Das Thumbnail is: 210px x 107px
Das Original ist: 520px x 264 px
Und sobald jemand auf das Thumbnail geht soll das Original aufspringen...NUR mit CSS...ich hab das schon versucht mit einem "Link ohne Ziel" im Prinzip geht das auch...nur das Bild macht ärger... -
Ja über JS wäre es einfacher, aber das is ne Aufgabe zu lösen NUR mit CSS...das is n ganz einfaches Rollover.
Das Thumbnail is: 210px x 107px
Das Original ist: 520px x 264 px
Und sobald jemand auf das Thumbnail geht soll das Original aufspringen...NUR mit CSS...ich hab das schon versucht mit einem "Link ohne Ziel" im Prinzip geht das auch...nur das Bild macht ärger...
mal so ne idee:
Versuchs doch mal mit dem Bild als intergrundbild, von einem Objekt, das eine Bestime größe hat, evtl. klappts so ja.
[edit=1]
so in etwa:
<html> <head> <title>test</title> <style type="text/css"> #bild { width:210px; height:107px; background-image:url(gross.gif); background-repeat:no-repeat; } #bild:hover { width:520px; height:264px; background-image:url(klein.gif); background-repeat:no-repeat; } </style> </head> <body> <div id="bild"></div> </body> </html>
[/edit]
Beitrag geaendert: 4.3.2007 19:00:18 von ruehrer -
ich versuchs...viellicht klappts so
-
herzlichen dank....hat funktioniert...und ich brech mir da voll einen ab...hehe ^^
naja...meißt is halt der einfachste weg, der beste... ;)
vielen lieben dank nochma
mfg -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage