Autor Zpráva
Sun Dancer
Profil
Zdravím všechny,
mohl by mi prosím někdo poradit s kouskem CSS kódu pro zobrazení určitého obrázku při přejetí myší přes odkaz v menu ?
V php jsem si vytvoril:

<div class="thumbnails">
              <a href="#">Cokoliv<span><img src="http://www.......jpg" alt="image1" height="30%" width="30%" /></span></a>
       </div>

a v příslušném CSS následně:

.thumbnails {
    float:left;
    position:relative;
    width: 65px;
    margin-right: 10px;
}
.thumbnails img{ /* je treba nastavit velikost 0x0 px, jinak to zase blika pri najeti na obrazek*/
    position:relative;
    display:none;
    width:0px;
    height:0px;
}    
.thumbnails:hover img {
    top:30%;
    left:55%;
    position:fixed;
    display:block;
    width:30%;
    height:30%;
    z-index:999;
    border:0px solid #d8d8d8;
    vertical-align:bottom;
    box-shadow: 5px 5px 5px 5px rgba(0,0,0,0.75); 

Vše funguje víceméně dobře až na to, že spolu s textem se mi v linku zobrazí i 0x0px velký obrázek, kterého se zaboha nemůžu zbavit a rozhazuje mi tak celé menu. Nemohl by mi prosím někdo poradit jak jinak to udělat, aby se mi zobrazil POUZE text, který mi po "hover" zobrazí obrázek ?
Předem velice děkuji za případné návrhy.
Bubák
Profil
Sun Dancer:
Vše funguje víceméně dobře až na to, že spolu s textem se mi v linku zobrazí i 0x0px velký obrázek, kterého se zaboha nemůžu zbavit
Jak víš, že problém dělá obrázek? Má přece display: none; nemůže dělat problémy, ať už má rozměry jakékoliv. Možná dělá problémy obalový span

Aby obrázek neblikal při přejíždění, možná pomůže visibility: hidden; (tipuji, že to nepomůže), ale jistota je nastavení opacity na nulu.
Pokud to nevadí, deklaroval bych zobrazení obrázku při jeho hoveru.

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm:

0