Привет всем!
сверстал я сайт но никак не могу доделать мелочь одну. Мне нужно чтобы при клике на ссылку под ним выехала подсказка или блок.....содержимое блока должно быть различное как и имаджи, инпуты так и простые ссыли.
Вот скрины того что нужно для наглядности:
решил реализовать на CSS c помощью
CODE ( text):
скопировать код в буфер обмена
a.tt{ position:relative; z-index:24; color:#3CA3FF; font-weight:bold; text-decoration:none; } a.tt span{ display: none; } /*background:; ie hack, something must be changed in a for ie to execute it*/ a.tt:hover{ z-index:25; color: #aaaaff; background:;} a.tt:hover span.tooltip{ display:block; position:absolute; top:0px; left:0; padding: 15px 0 0 0; width:200px; color: #993300; text-align: center; filter: alpha(opacity:90); KHTMLOpacity: 0.90; MozOpacity: 0.90; opacity: 0.90; } a.tt:hover span.top{ display: block; padding: 30px 8px 0; background: url(bubble.gif) no-repeat top; } a.tt:hover span.middle{ /* different middle bg for stretch */ display: block; padding: 0 8px; background: url(bubble_filler.gif) repeat bottom; } a.tt:hover span.bottom{ display: block; padding:3px 8px 10px; color: #548912; background: url(bubble.gif) no-repeat bottom; }
CODE ( text):
скопировать код в буфер обмена
<a href="#" class="tt"> Тут текст термина (который нуждается в подсказке) <span class="tooltip"> <span class="top"> </span> <span class="middle"> <a href="#" ><img src="img/vk.png" ></a> </span> <span class="bottom"> </span> </span> </a>
но я вместо текста подсказки не могу вставить картинки в ссылке, только лишь текст и все или только картинки.
Возможно я гдето ошибся. возможно мне нужно использовать другой скрипт и применить JS. Подскажите как реализовать всплывающие блоки такие
|