Эффект hover для просмотра темы все версии.

автор Пт 15 Янв - 10:46

Код:: if (/\/?f\d+.*/.test(window.location.pathname)) { $(function () { $('a.topictitle').after('<a href="#" style="margin-left: 5px;" class="preview_topic"><img src="http://i.imgur.com/gdvRoFW.png"/></a>'); $('.preview_topic').click(function () { var url = this.previousSibling.href; $('body').prepend('<style>.popupWrapper {background-color: rgba(70, 70, 70, 0.6);border-radius: 4px 4px 4px 4px;box-shadow: 0 12px 25px rgba(0, 0, 0, 0.7);left: 300px;margin: 0 auto !important;max-height: 400px;max-width: 700px;overflow: auto;padding: 4px;position: fixed !important;top: 200px;}</style><div style="width: 100%; height: 100%; position: fixed; top: 0px; left: 0px; z-index: 10000; opacity: 0.4; background-color: #3E3E3E;" class="modal" id="document_modal"></div><div id="topic_popup" class="popupWrapper" style="z-index: 10001;"></div>'); $('#topic_popup').load(url + ' .post:first', function () { $('#document_modal').click(function () { $('#document_modal, #topic_popup').remove(); }); }); return false; }); }); }

Эффект hover для просмотра темы все версии. UnKas1b

автор Пт 15 Янв - 10:47

Можно просмотреть тему, не заходя в неё. Ну правда показывает только первый пост.

автор Пт 15 Янв - 10:50

Код:: if (/\/?f\d+.*/.test(window.location.pathname)) { $(function () { $('a.topictitle').after('<a href="#" style="margin-left: 5px;" class="preview_topic"><img src="http://i.imgur.com/gdvRoFW.png"/></a>'); $('.preview_topic').click(function () { var url = this.previousSibling.href; $('body').prepend('<style>.popupWrapper {background-color: rgba(70, 70, 70, 0.6);border-radius: 4px 4px 4px 4px;box-shadow: 0 12px 25px rgba(0, 0, 0, 0.7);left: 300px;margin: 0 auto !important;max-height: 400px;max-width: 700px;overflow: auto;padding: 4px;position: fixed !important;top: 200px;}</style><div style="width: 100%; height: 100%; position: fixed; top: 0px; left: 0px; z-index: 10000; opacity: 0.4; background-color: #3E3E3E;" class="modal" id="document_modal"></div>'); $('.pun').prepend('<div id="topic_popup" class="popupWrapper" style="z-index: 10001;"></div>'); $('#topic_popup').load(url + ' .post:first', function () { $('#document_modal').click(function () { $('#document_modal, #topic_popup').remove(); }); }); return false; }); }); }

автор Пт 15 Янв - 10:53

Расположение предназначены в соответствующих местах, где требуется применить эффекты JavaScript на форумах. В нашем случае, мы будем применять На всех страницах.

автор Вс 17 Янв - 0:24

В коде что-то про PunBB написано, но на bb3 работает точно.

Код:: $(function(){ var isPunbb = ''; if ($('.pun').length) var isPunbb = 'class="pun"'; $('a.topictitle').after(' <img id="topicPreview" src="http://i56.servimg.com/u/f56/18/45/41/65/new_wi10.gif" title="Preview topic" alt="Preview" style="cursor:pointer;"/>'); $('img#topicPreview').click(function() { $('body').append('<div id="preview-filter" style="position:fixed;left:0;right:0;top:0;bottom:0;background:url(http://i39.servimg.com/u/f39/18/21/41/30/overla10.png);cursor:pointer;z-index:10;"></div><div id="topicPreview-container" '+isPunbb+' style="width:auto;top:20%;left:15%;right:15%;padding:4px;position:fixed;z-index:50;background:#EEE;border:1px solid #CCC;border-radius:5px;"><div id="topicPreviewing" style="max-height:400px;overflow-y:auto;"><center><span class="topicPreview-loading" style="font-weight:bold;font-size:18px;">Loading...</span></center></div></div>'); $('#topicPreviewing').load($(this).siblings('a.topictitle').attr('href')+' .post:eq(0)'); $('#preview-filter').click(function(){$('#preview-filter, #topicPreview-container').remove()}); }); });

Эффект hover для просмотра темы все версии.

Re: Эффект hover для просмотра темы все версии.

Для PUNBB

Re: Эффект hover для просмотра темы все версии.

Еще вариант.

URL:
BBCode:
HTML: