Всплывающий текст последнего сообщения темы при наведении курсора
(на Главной, в каталоге форумов, в Активных темах)
При наведении курсора на ячейку с последним сообщением, всплывает окошко с превью поста.
Автор: 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>