Autor | Zpráva | ||
---|---|---|---|
ZANE Profil * |
#1 · Zasláno: 7. 10. 2007, 20:35:22
Nevíte někdo co s následujícím? Hover nápověda pod Operou 9.23 je plně funkční - ovšem jen do okamžiku než se jí do cesty postaví tabulka. Pak se zobrazí jenom část, nebo se různě překrývá, nebo se zobrazí pokaždé jinde. IE, NN, Firefox - v cajku.
Zdrojáky: Stránka: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=windows-1250"> <link href="styl.css" type=text/css rel=StyleSheet> <title></title> </head> <body> <a class="thumbnail" href="#thumb">Prejdite sem myšou <span> <img src="http://www.kasman.sk/download/ikonky/tlacitka/otaznik/b_1.bmp"> <br> Tu sa zobrazí obrázok a text,<br>ktorý reprezentuje odkaz,<br>na ktorý ste prešli myšou. </span> </a> <table width="539" class="pi2"> <tr> <td align="left"> text tabulky jfgdkggd<br> text tabulky jfgdkggd<br> text tabulky jfgdkggd<br> text tabulky jfgdkggd<br> text tabulky jfgdkggd<br> text tabulky jfgdkggd<br> text tabulky jfgdkggd<br>¨ text tabulky jfgdkggd<br> </td> </tr> </table> <a class="thumbnail" href="#thumb">Prejdite sem myšou <span> <img src="http://www.kasman.sk/download/ikonky/tlacitka/otaznik/b_1.bmp"> <br> Tu sa zobrazí obrázok a text,<br>ktorý reprezentuje odkaz,<br>na ktorý ste prešli myšou. </span> </a> </body> </html> CSS: /* CSS Document */ .thumbnail{position: relative; z-index: 0} .thumbnail:hover{background-color: transparent; z-index: 50;} .thumbnail span{ /*CSS for enlarged image*/ position: absolute; background-color: lightyellow; padding: 5px; left: 10px; border: 1px dashed gray; visibility: hidden; color: black; text-decoration: none;} .thumbnail span img{ /*CSS for enlarged image*/ border-width: 0; padding: 2px;} .thumbnail:hover span{ /*CSS for enlarged image on hover*/ visibility: visible; top: 20px; left: 60px; /*position where enlarged image should offset horizontally */ } A.thumbnail:link {COLOR: #C37108; cursor: help; TEXT-DECORATION: none;} A.thumbnail:active {COLOR: #C37108; cursor: help; TEXT-DECORATION: none;} A.thumbnail:hover {COLOR: #C37108; cursor: help; TEXT-DECORATION: none;} A.thumbnail:visited {COLOR: #C37108; cursor: help; TEXT-DECORATION: none;} |
||
Zane Profil * |
#2 · Zasláno: 8. 10. 2007, 12:22:45
Už to funguje i pod operou: ta si nerozumí s position: relative; když jsem použil hodnotu position: absolute; a vnořenou pozici pro umístění tak to fachá. I všechny ostatní vychytávky které požívají hover efektu a předtím nechodily.
|
||
Časová prodleva: 17 let
|
0