jürgen: grafik mit :hover ein- und ausblenden

SELF-Forum

grafik mit :hover ein- und ausblenden

jürgen
– Informationen zu den Bewertungsregeln

Ich habs zwar schon verwendet aber irgendwie steh ich aufm Schlauch ...

Ich hab eine Tabellenzelle mit einem Schwarzweiss-Thumbnail als Background und möchte bei td:hover das farbige Thumbnail einblenden/drüberlegen welches auch mit einem Link versehen ist.

Könntet ihr mir einen kurzen Denkanstoß geben, ich dreh mich im Kreis.

Danke!

Jürgen

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. grafik mit :hover ein- und ausblenden

    Cheatah
    – Informationen zu den Bewertungsregeln

    Hi,

    Könntet ihr mir einen kurzen Denkanstoß geben, ich dreh mich im Kreis.

    zumindest kann ich Dir ein Stichwort (vulgo Suchbegriff) geben: CSS-Sprites.

    Cheatah

    --
    X-Self-Code: sh:( fo:} ch:~ rl:| br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

  2. grafik mit :hover ein- und ausblenden

    jürgen
    – Informationen zu den Bewertungsregeln

    hm, ich glaube, jetzt bin ich doch selbst draufgekommen:

      
table#thumbtabelle td {  
background-image: url(grafiken/thumb-allerlei-hg.jpg);  
background-position: center center;  
background-repeat: no-repeat;  
}  
table#thumbtabelle td img {  
visibility: hidden;  
}  
table#thumbtabelle td:hover img {  
visibility: visible;  
}

    Sorry, hätte doch noch 10min weiterprobieren sollen ;-)

    LG, Jürgen

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. grafik mit :hover ein- und ausblenden

      Antipitch
      – Informationen zu den Bewertungsregeln

      Hi Jürgen,

      hm, ich glaube, jetzt bin ich doch selbst draufgekommen:

      würde ich auch sagen.

      Außer Thema

      table#thumbtabelle td:hover

      Browserkompatibilität vielleicht. Aber meinen Segen hast du: IE6, der Agent Smith des Internets...

      cheers
      Antipitch

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

      1. grafik mit :hover ein- und ausblenden

        Gunnar Bittersmann Homepage des Autors
        – Informationen zu den Bewertungsregeln

        @@Antipitch:

        nuqneH

        hm, ich glaube, jetzt bin ich doch selbst draufgekommen:
        würde ich auch sagen.

        Würde ich nicht sagen.

        Der Hinweis von Cheatah verdient Beachtung.

        Webkrauts: Sehr sehr schnelle Seiten – Website Performance Best Practice – Teil 1
        A List Apart: CSS Sprites: Image Slicing’s Kiss of Death

        Qapla'

        --
        Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)
        Beitrag melden
        –
        Informationen zu den Bewertungsregeln

      2. grafik mit :hover ein- und ausblenden

        jürgen Homepage des Autors
        – Informationen zu den Bewertungsregeln

        Hi Jürgen,

        hm, ich glaube, jetzt bin ich doch selbst draufgekommen:

        würde ich auch sagen.

        Außer Thema

        table#thumbtabelle td:hover

        Browserkompatibilität vielleicht. Aber meinen Segen hast du: IE6, der Agent Smith des Internets...

        Ach ja, danke für den Hinweis!

        Ich habs - eben auf Grund der mittlerweile geringen Verbreitung - quick and dirty gelöst, indem ich die Grafiken (mit den Links) einfach wieder auf visible setze ;-)

          
<!--[if lt IE 7]>  
<style type="text/css">  
table#thumbtabelle td img {  
visibility: visible;  
}  
</style>  
<![endif]-->

        Danke und LG, Jürgen

        Beitrag melden
        –
        Informationen zu den Bewertungsregeln