kostenloser Webspace werbefrei: lima-city

Mouseover image

lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript

1. Autor dieses Themas

   exotic-mgc

   

   exotic-mgc hat kostenlosen Webspace.

   14:26, 31.10.2013

   Guten Tag,
   
   ich versuche derzeit auf meiner neuen Homepage ein Mouseover einzubauen.
   Durch das Mouseover soll ein Bild in den Vordergrund gesetzt werden und vergrößert werden.
   Ich habe nun schon einige möglichkeiten durchprobiert doch leider klappt keine dieser möglichkeiten.
   
   Außerdem, soll beim Mouseover ein Text angezeigt werden (in einer extra Box) also nicht
   <p><img src="Beispielbild.png" alt="Beispiel"></p>
   
   Ich hoffe auf einen Guten Tipp.
   
   Gruß Kovel
   
   Beitrag zuletzt geändert: 31.10.2013 16:31:59 von exotic-mgc

2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

3. ecollage

   

   ecollage hat kostenlosen Webspace.

   20:48, 31.10.2013

   Also ... ich habe da mal was ausprobiert, nach Vorgaben wie z.B. diese hier => http://www.webmasters-solution.de/workshops/css/info-text.html ... da habe ich 's beim <span> Element halt mit Klassenzuweisung probiert ... und es funktioniert => http://ecollage.lima-city.de/help/test.html (mit Transparenz)
   
   das selbe dann nochmal nach dieser Vorgabe => http://brauchbar.de/artikel/css/der-mouseover-effekt-mit-css ... das habe ich in der ersteren Variante verbaut => http://ecollage.lima-city.de/help/test2.html
   
   FF, Chrome, IE funzt Beides ... Opera, Safari weiß ich nicht !
   Das Gute daran ist, es kommt Beides ohne JS aus ...
   
   naja, mußt mal schauen ... und Deinen Wünschen anpassen (bedien Dich am Quelltext) ;)
   
   Beitrag zuletzt geändert: 1.11.2013 10:04:19 von ecollage

4. wsgraphics

   wsgraphics hat kostenlosen Webspace.

   19:59, 4.11.2013

   grundsätzlich lässt sich so etwas mit der Pseudoklasse :hover machen.
   Das Element selbst setzt Du auf unsichtbar und erst bei überfahren wird dann die Sichtbarkeit auf true gesetzt
   
   Falls Dich Einzelheiten interessieren, sag mir Bescheid, ich schicke Dir dann ein paar Beispielzeilen...
   
   Beitrag zuletzt geändert: 4.11.2013 20:00:10 von wsgraphics

5. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?