Всплывающая картинка при наведении на ссылку или на картинку

/*Всплывающий скриншот*/   <br>   .thumbnail{   <br>   position: relative;   <br>   z-index: 0;   <br>   }   <br>   .thumbnail:hover{   <br>   background-color: transparent;   <br>   z-index: 50;   <br>   }   <br>   .thumbnail span{ /*CSS for enlarged image*/   <br>   position: absolute;   <br>   background-color: #3d3d3d;   <br>   padding: 5px;   <br>   left: -1000px;   <br>   border: 1px solid white;   <br>   visibility: hidden;   <br>   color: Yellow;   <br>   text-decoration: none;   <br>   border-radius: 4px 4px 4px 4px;   <br>   -moz-border-radius: 4px 4px 4px 4px;   <br>   -webkit-border-radius: 4px 4px 4px 4px;   <br>   }   <br>   .thumbnail span img{ /*CSS for enlarged image*/   <br>   border-width: 0;   <br>   padding: 2px;   <br>   }   <br>   .thumbnail:hover span{ /*CSS for enlarged image on hover*/   <br>   visibility: visible;   <br>   top: 0;   <br>   left: 60px; /*position where enlarged image should offset horizontally */   <br>   }   <br>   /*---------------------*/

<a class="thumbnail" href="#">Ссылка<span>Здесь описание<img src="ВАША КАРТИНКА" width="500"/></span></a>

<a class="thumbnail" href="#"><img src="ссылка на рисунок" width="100px" height="66px" border="0" /><span><img src="ссылка на рисунок" />Ваш текст</span></a>