Question

    Здравствуйте! Не мало времени потратил в интернете, чтобы найти способ реализовать всплывающее окно с описанием и картинкой при наведении курсора на ссылку.</p>

    Единственное, что нашёл:

в CSS

.thumbnail{  
position: relative;  
z-index: 0;  
}  
.thumbnail:hover{  
background-color: transparent;  
z-index: 50;  
}  
.thumbnail span{ /*CSS for enlarged image*/  
position: absolute;  
background-color: #3d3d3d;  
padding: 5px;  
left: -1000px;  
border: 1px solid white;  
visibility: hidden;  
color: Yellow;  
text-decoration: none;  
border-radius: 4px 4px 4px 4px;
-moz-border-radius: 4px 4px 4px 4px;
-webkit-border-radius: 4px 4px 4px 4px;
}  
.thumbnail span img{ /*CSS for enlarged image*/  
border-width: 0;  
padding: 2px;  
}  
.thumbnail:hover span{ /*CSS for enlarged image on hover*/  
visibility: visible;  
top: 0;  
left: 60px; /*position where enlarged image should offset horizontally */  
}  

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

   Ссылки находятся в информере. Значит надо нижний код вставлять в шаблон информера. А что дальше не могу понять, из-за нехватки знаний. Подставлял разные операторы, не помогло.
    Может кто-то проделывал то, что мне нужно. Есть идеи?
   Помогите пожалуйста новичку.

Comments

Спасибо вам большое.
Только оператор $MESSAGE$ не работает. Пробовал других операторов- они отображаются.
В дизайне -> страница материала и комментариев к нему все просматривал. Там оператор $MESSAGE$ стоит и все выводит.

Answer 1

Вы дали ровно ноль информации по вопросу. Для какого модуля делаете информер. Какие настройки информера. Сайт закрыт на тех.работы

Поэтому даю приблизительный код, чтобы Вы поняли примерно как и что

<a class="thumbnail" href="$ENTRY_URL$">$TITLE$<span>
$MESSAGE$<img src="$IMG_URL1$" width="500"/></span></a>

Где выделли систменые коды, которые отвечают за:

Красное - ссылка на материал

Зеленое  - название (текст ссылки)

Оранжевое - описание материала

Синее - картинка к материалу, с условием, что картинка прикреплена к самомоу материалу через кнопку обзор при добавлении материала

Answer 2

Всё у Вас работает, нужно только подставить операторы

http://jsfiddle.net/hjgj2ub9/

Comments

Подскажите а почему $MESSAGE$ не работает в информере? Модуль каталог сайтов.

---

Все работает, шаблон информера должен быть примерно таким:
<table border="0" cellpadding="2" cellspacing="1" width="100%" class="infTable">
<tr><td align="center" class="infTitle" colspan="2"><a href="$ENTRY_URL$">$TITLE$</a></td></tr>
<tr><td>$MESSAGE$</td></tr>
</table>