Всплывающий текст последнего сообщения темы при наведении курсора
(на Главной, в каталоге форумов, в Активных темах)
При наведении курсора на ячейку с последним сообщением, всплывает окошко с превью поста.
Автор: Duka, Deff
Платформа: MyBB
Все в самый низ HTML-низ
Разметка
Код:
<div id="modal-m" class="m-message" style="top: 740px; display: none;left:50%;">
<div class="main-container">
<span class="name-author"><strong></strong> написал(а):</span>
<span class="p-messages"></span>
</div>
</div>Стиль
Код:
<style type="text/css">
#modal-m {width: 250px; height: 155px; background: #eee; box-shadow: 0 0 8px #777; opacity: 0.9; position: absolute; border-left: 10px solid #80c3f4; padding: 10px;margin: 30px auto 0 160px;}
#modal-m span {display: block; font-family: verdana;}
.name-author {width: 100%; height: 14px; margin-bottom: 15px; color: #05a1f0;}
.p-messages {height: 120px; color: #555; max-height: 120px; overflow: hidden; margin-bottom: 10px;}
.p-messages img {max-height: 60px;}</style>Скрипт
Код:
<script type="text/javascript">
(function($){
$(function(){
var $punMain = $('#pun-main')
,$modal = $('#modal-m')
,postsCache = {};
if (!$punMain.length) return;
var popupContent = function(topicId) {
if (typeof topicId == 'undefined') return;
if (typeof postsCache[topicId] == 'undefined') return;
var userName = postsCache[topicId]['author'].replace(/mybb@mybb.ru \((.*)\)/, "$1");
var postContent = postsCache[topicId]['title'];
$modal.find('.name-author strong:first').html(userName);
$modal.find('.p-messages').html(postContent);
};
$('.category .tcr a, .forum .tcr a').hover(function(){
var link = $(this).attr('href');
if(document.URL.indexOf('/search.php?action=show_recent')!=-1||document.URL.indexOf('/search.php?action=show_new')!=-1)link = $(this).parents('tr:first').find('.tcl a:first').attr('href');
var topicId = /\?id=(\d+)/.exec(link)[1];
$modal.css('top', $(this).offset().top+25).show();
$modal.find('.p-messages').html('<img src="http://q2.qsdb.ru/ajax-loader.gif" alt="Загружаю" />');
if (typeof postsCache[topicId] == 'undefined') {
$.get('/export.php', {type: 'rss', tid: topicId}, function(data){
if (data) {
postsCache[topicId] = {
title: $(data).find('channel').find('item:first').find('description').text(),
author: $(data).find('channel').find('item:first').find('author').text()
};
popupContent(topicId);
}
});
} else popupContent(topicId);
}, function(){
$modal.hide();
});
});
})(jQuery);
</script>
