При наведении на текст или картинку будет появляться небольшое окошко (которое сможете настроить под себя в CSS).
В ваш файл стилей добавляем такой код:
.thumbnail{position:relative;z-index:0;width:0px;height:0px;border:0px;background:none;float:right;left:-10px;}
.thumbnail:hover{background-color:transparent;z-index: 50;}
.thumbnail span{position:absolute;width:230px;background-color:#fff;padding:5px;left:-1000px;border:2px solid #cecece;font-size:16px;font-weight:300;visibility:hidden;color:#505050;text-decoration:none;border-radius:4px 4px 4px 4px;
-moz-border-radius:4px 4px 4px 4px;-webkit-border-radius:4px 4px 4px 4px;}
.thumbnail:hover span{visibility:visible;top:50;left:-225px;}
В html код так выглядит:
<a class="thumbnail" href="#v1">Текст_или_фото<span>ТЕКСТ</span></a>
Где «<span>ТЕКСТ</span>» и есть наше всплывающее окошко, в которое мы можем добавить текст, картинку ну или полноценный блок. С настройками CSS думаю у вас не возникнет проблем.
