Всплывающая подсказка
Добрый вечер, подскажите пожалуйста как реализовать нечто подобное:
На wordpress. Т.е. при наведении появляется что то типа всплывающей подсказки. заголовок и контент генерируется php кодом типа: <?php the_title() ?> и т.д. Пробовал несколько готовых jquery плагинов, но они к сожалению выводят только html, т.е. вместо php кода ничего не выводится. Подскажите пожалуйста, куда шагать? С уважением. Николай. |
Цитата:
|
Цитата:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="http://code.jquery.com/jquery-1.7.2.min.js">
</script>
<style>
div#title {
position:absolute;
top:0;
left:0;
padding:5px;
width:200px;
height:200px;
border: 1px solid #283250;
display:none;}
div#container img{width:100px;
height:125px;}
</style>
<script>
$(document).ready(function(){
$('#container img').hover(
function(){$('#container img').mousemove(function (pos) {
$("div#title").css('left',(pos.pageX+20)+'px').css('top',(pos.pageY+20)+'px').css('display','block').css('background','#ccc'); $('div#title').html($('#container img').attr('title')+'\n <a href="http://ya.ru">hello</a>');
}); },
function(){$('div#title').css('display','none');}
);
});
</script>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Документ Без Имени</title>
</head>
<div id='container'>
<div id='title'></div>
<img src="http://im4-tub-ua.yandex.net/i?id=132572371-61-72" title='picture of motobiker'/>
</div>
<body>
</body>
</html>
только как потом нажать на ссылку в этом окошке , надо подумать (думаю задержку сделать можно) |
Спасибо большое за помощь, нашел уже написанное решение:)
Вот как решил если кому нужно будет. http://dimox.name/beautiful-tooltips-with-jquery/ |
| Часовой пояс GMT +3, время: 19:42. |