kostenloser Webspace werbefrei: lima-city


Mouseover image

lima-cityForumDie eigene HomepageHTML, CSS & Javascript

  1. Autor dieses Themas

    exotic-mgc

    Kostenloser Webspace von exotic-mgc

    exotic-mgc hat kostenlosen Webspace.

    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. 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. 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?

Über lima-city

Login zum Webhosting ohne Werbung!