<
!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>
</
body>
</
html>
/* 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;
}
