В каталоге запрещено создавать новые темы, т.к. скриптов очень много, а мы стараемся делать хорошую навигацию по разделу и добавлять их упорядоченно. Скрипты, которых еще нет в этом разделе можно выкладывать в этой теме. И модератор добавит их на форум.
Добавление скриптов и css трюков для MYBB
Сообщений 81 страница 90 из 148
Поделиться8105.12.12 00:28
Предосмотр содержания темы при наведении курсора
Автор - Romych
в html-верх:
<style type="text/css"> #prosmotr { position: absolute; z-index:1000; filter: alpha(opacity=90); opacity: 0.9; font-size: 12px; background-color: black; color: white; border: 2px solid #ccc; max-width:600px; margin:-7% 10%; -moz-border-radius: 8px; border-radius: 8px; khtml-border-radius:8px; -webkit-border-radius:8px; background-image: -webkit-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0)); background-image: -moz-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0)); background-image: -ms-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0)); background-image: -o-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0)); background-image: linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0)); -moz-box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset; -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset; box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset; table-layout: auto !important;} #tema td {padding:1px !important; border: none !important;} .visor img {max-width:50px !important;} .visor object, .visor embed {width:250px !important; height:141px !important} </style>
в html-низ:
<!--Предосмотр темы v.2--> <script type="text/javascript"> $('div#pun-viewforum div.tclcon a').hover(function(){ poisk=$(this).attr('href'); zapros=poisk.slice(poisk.indexOf("viewtopic.php?id=")+17); $(this).append('<div id="prosmotr"><h1 align="center"><b>Последние 3 сообщения в этой теме</b></h1><table id="tema" cellspacing="0" width=100%></table></div>'); $.get('export.php?type=rss&tid='+zapros,'',prevTEMA); function prevTEMA(data){ $(data).find('item:lt(3)').each(function(){ var TAuthor=$(this).find('author').text().slice(14,-1);var TPosted=$(this).find('pubDate').text().slice(4,-9); var TContent=$(this).find('description').text();TContent = TContent.replace(/([\t|"|']+?)/gim, '').replace(/ /, ''); $('#tema').append('<tr><td><b>'+ TAuthor +'</b> написал(а):</td><td class="visor" width=50%>'+TContent+'</td><td style="text-align:center">'+TPosted+'</td></tr>'); }); } }, function(){ $(this).find('div#prosmotr').remove(); }); </script>
Просмотр 10 Сообщений при наведении на тему в Форумах
Автор - Deff
<style type="text/css"> #prosmotr { position: absolute; z-index:1000; filter: alpha(opacity=90); opacity: 0.9; background-color: #484855; border: 2px solid #ccc; text-shadow:#000 1px 1px 1px; width:580px; background-image: -webkit-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0)); background-image: -moz-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0)); background-image: -ms-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0)); background-image: -o-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0)); background-image: linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0)); -moz-border-radius: 8px; border-radius: 8px; khtml-border-radius:8px; -webkit-border-radius:8px; -moz-box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset; -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset; box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset; table-layout: auto !important;} #tema td {word-wrap:break-word;border-style: dotted none none dotted;padding:1px !important;} #tema td[width="60%"]{ text-align:justify; pading-right:22px!important; color:#C9C9CE; text-shadow:#000 1px 1px 1px; background-color: #000; font-size:11px; } </style> <!--Предосмотр темы--> <script type="text/javascript"> $('div#pun-viewforum div.tclcon a').hover(function(){ poisk=$(this).attr('href'); zapros=poisk.slice(poisk.indexOf("viewtopic.php?id=")+17); $(this).append('<div id="prosmotr"><table id="tema" cellspacing="0" width=100%></table></div>'); $.get('export.php?type=rss&tid='+zapros,'',processTEMA); function processTEMA(data){ $(data).find('item:lt(10)').each(function(){ TAuthor=$(this).find('author').text().slice(14,-1); TLink=$(this).find('link').text(); TPosted=$(this).find('pubDate').text().slice(4,-5); TContent=$(this).find('description').text(); $('#tema').append('<tr><td width=17% style="color:#F3F3F3;"><b>'+ TAuthor +'</b></td><td width=60%><a href="'+TLink+'">Ссылка на пост </a>'+TContent+'</td><td style="color:RoyalBlue">'+TPosted+'</td></tr>'); }); } }, function(){ $('div#pun-viewforum div.tclcon a').find('div:last').remove(); }); </script>
Отредактировано Герда (05.12.12 00:30)
Поделиться8205.12.12 00:49
Бегунок по cообщениям на странице
Автор - Deff
4 кнопки:
верхняя стрелка - перемещение на предыдущий пост
самая нижняя стрелка - перемещение на следущий пост
Две внутренних: перемещение внутри поста - к началу и к концу.
кроме того они переключают режим перемещений для нижней стрелки (в соответствии с последним нажатием внутренних кнопок - нижняя стрелка будет перемещать либо на начало последующих сообщениях, либо на конец сообщения)
Для установки скрипта - должен быть включён рейтинг поста в сообщении
Двойной Клик по сообщению - сворачивает/разворачивает стрелки.
При развороте Двойным Кликом, стрелка стразу настраиваецо на текущий, кликанутый пост, т.е может сходу перемещацо с текущего места и далее - а не с первого поста (*или того места, где мы начав читать, забыли на время о стрелке)
В HTML низ или в HTML в форме Ответа
<script id="Jumper_on_the_forum_posts"> var a=document.URL; if($(".punbb").attr("id")=="pun-viewtopic"){ var img1='http://savepic.net/1972852.png'; //forLight-BlackFld; var MaxNumPst, PostList=[],MaxPost; $(".post").each(function (j){var l=$(this).attr("id");PostList[j]='#'+l; $(this).attr("alt",j);$(this).find(".post-rating").attr("id",l+"B") MaxNumPst=j;});MaxPost=PostList[MaxNumPst]; function StrelkaHide(){ if(imgMap.hasClass('Show')){ imgMap.parent("div").animate({ marginLeft: "-26px" }, 1000 ); imgMap.animate({ width: "13px" }, 1000,function(){imgMap.removeClass("Show")} ); } } function Strelkshow(){ if(!imgMap.hasClass('Show')){ ClickSuM++; NoFirstClick=false Loading_href(); imgMap.parent("div").animate({ marginLeft: "-53px" }, 1000 ); imgMap.animate({ width: "62px" }, 1000,function(){imgMap.addClass("Show")} ); } } var ClickSuM=0; function TestClicK(){ if(ClickSuM){ClickSuM=0; } else StrelkaHide(); timId00=setTimeout("TestClicK(TimeTest)",TimeTest); } var StartPost=a.replace(/^.+(#p\d+).*$/img,"$1"); //Есть в ссылке указание на Пост? if(StartPost!=a){var NumStPost=$(StartPost).attr("alt"); } else {NumStPost=0;StartPost=PostList[0];} var L="<span style=\"float:right;\" ><div style=\"display:none;margin-left:-52px!important;float:right;top:40%;position:fixed;z-index:3000;\"><img id=\"JumperRecords\" class=\"Show\" usemap=\"#JumpRec\" src=\""+img1+"\" /><map name=\"JumpRec\"><area shape=\"poly\" coords=\"34,37, 23,47, 21,47, 21,27, 8,27, 34,3, 60,27, 47,27, 47,47, 45,47\" title=\"К предыдущему Сообщению\"/><area shape=\"poly\" coords=\"34,38, 44,48, 41,49, 41,59, 29,59, 29,49, 24,48\" title=\"к Началу текущего Поста\"/><area shape=\"poly\" coords=\"29,66, 40,66, 40,75, 44,77, 34,88, 24,78, 29,77\" title='к \"Цитировать\"'/><area shape=\"poly\" coords=\"34,122, 8,98, 21,98, 21,78, 23,78, 34,89, 45,78, 47,78, 47,98, 60,98\" title=\"К последующему Сообщению\"/></map></div></span>"; $(StartPost+" .post-box").after(L); var imgMap=$("#JumperRecords") imgMap.parent('div').show(); function Loading_href(){ var L=$("map[name='JumpRec'] area") if(NumStPost<0){NumStPost=MaxNumPst};if(NumStPost>MaxNumPst){NumStPost=0}; L.eq(0).attr("href",PostList[NumStPost]); L.eq(1).attr("href",PostList[NumStPost]); L.eq(2).attr("href",PostList[NumStPost]+"B"); L.eq(3).attr("href",PostList[NumStPost]+JMPswitch); } var NoFirstClick=false,JMPswitch=''; Loading_href(); //Загрузка ClicK_YES=true; $("#JumperRecords").parent('div').dblclick(function(){ //Защита от Анимации по клику на стрелку ClicK_YES=false; }); var TimeTest=20000 timId00=setTimeout("TestClicK(TimeTest)",TimeTest) //Автосворачивание через время TimeTest $(".post").dblclick(function(){ if(ClicK_YES){NumStPost=parseFloat($(this).attr("alt")); StrelkaHide();Strelkshow(); }ClicK_YES=true; }); function TESTandReload(ThisArea){if(NoFirstClick==true){ if(ThisArea.attr("title")=="К предыдущему Сообщению"){NumStPost=NumStPost-1;}; if(ThisArea.attr("title")=="К последующему Сообщению"){NumStPost++;};} if(ThisArea.attr("title")=="к \"Цитировать\""){JMPswitch='B';} if(ThisArea.attr("title")=="к Началу текущего Поста"){JMPswitch='';} Loading_href(); } $("map[name='JumpRec'] area").click(function (){ ClickSuM++;TESTandReload($(this)); NoFirstClick=true; });} </script>
Поделиться8305.12.12 01:09
Доступ в раздел или в тему по ключевому слову в статусе
Автор - Deff
Пример записи в Статусе Пользователя кодов открытия/закрытия тем и форумов:
Старожил,F4,F1,T1,T5,T3,f1,f3,t1,t3
Все кодовые слова - пишутся латиницей (дабы не было ошибок в написании "T" русскими буквами)
В HTML верх
<!-- Доступ к Теме-Форуму по Коду в Статусе Ч1, HTML верх -->
<div id="ListForumsAndTems" style="display:none;"><p id=ListOffForums><!-- ЗАКРЫТЫЕ(ОТКРЫВАЕМЫЕ КОДОМ) ФОРУМЫ -->
<i>F1</i><a href="http://forum.mybb.ru/viewforum.php?id=5">Вопросы по оформлению форума</a>
<i>F2</i><a href="http://forum.mybb.ru/viewforum.php?id=7">Комната отдыха</a>
<i>F3</i><a href="http://forum.mybb.ru/viewforum.php?id=6">Наши форумы</a>
<i>F4</i><a href="http://forum.mybb.ru/viewforum.php?id=16">Новые возможности форумов</a>
</p><p id=ListOffTems><!-- ЗАКРЫТЫЕ(ОТКРЫВАЕМЫЕ КОДОМ) ТЕМЫ -->
<i>T1</i><a href="http://forum.mybb.ru/viewtopic.php?id=28074">ДДос атаки и хакерство</a>
<i>T2</i><a href="http://forum.mybb.ru/viewtopic.php?id=28002">Общие вопросы по оформлению</a>
<i>T3/F2</i><a href="http://forum.mybb.ru/viewtopic.php?id=28190">Чайная</a>
<i>T4</i><a href="http://forum.mybb.ru/viewtopic.php?id=27962">Форум о Нэнси Дрю</a>
<i>T5/F2</i><a href="http://forum.mybb.ru/viewtopic.php?id=27935">?? Трактир "Под кудлатым мишкой" ??</a>
</p><!-- ВОЗНИКАЮЩАЯ НЕОБХОДИМОСТЬ ЗАКРЫТИЯ ФОРУМОВ И ТЕМ ОТДЕЛЬНЫМ ЮЗЕРАМ -->
<!-- ====!!ВСЕ ДАННЫЕ ТЕМЫ и ФОРУМЫ БУДУТ СКРЫТЫ от ГОСТЕЙ!!============= --><p id=SpecOffForums><!-- ОТКРЫТЫЕ(ЗАКРЫВАЕМЫЕ КОДОМ) ФОРУМЫ -->
<i>f1</i><a href="http://forum.mybb.ru/viewforum.php?id=12">Проблемы с форумом</a>
<i>f2</i><a href="http://forum.mybb.ru/viewforum.php?id=25">Безопасность</a>
<i>f3</i><a href="http://forum.mybb.ru/viewforum.php?id=29">Проектируем MyBB нового поколения</a>
<i>f4</i><a href="http://forum.mybb.ru/viewforum.php?id=33">Вторая жизнь</a>
</p><p id=SpecOffTems><!-- ОТКРЫТЫЕ(ЗАКРЫВАЕМЫЕ КОДОМ) ТЕМЫ -->
<i>t1</i><a href="http://forum.mybb.ru/viewtopic.php?id=28284">О_о</a>
<i>t2</i><a href="http://forum.mybb.ru/viewtopic.php?id=28254">С днем рождения, rps!</a>
<i>t3</i><a href="http://forum.mybb.ru/viewtopic.php?id=24477">Своя иконка для вновь созданной темы</a>
<i>t4</i><a href="http://forum.mybb.ru/viewtopic.php?id=28264">НескончаеМЫе вопросы от новичков (33)</a>
</p></div><script src="http://hostjs-mybb2011.narod.ru/js/AccessTopicAndForum.js"></script>
Вместо Текущих строк, прописанных в HTML верх, для скрытия/открытия форумов и тем:
<i>Код</i><a href="Ссылка">Название темы/форума</a>
Прописываем Свои (лишние строки убираем или добавляем необходимые)
Ps: Ccылку на тему в скрипте - ставим чистую, т.е. ту что появляется в Окне браузера по клику на Заголовок темы в форуме(а не на произвольную страницу темы или клику на последнее сообщение
Образцы Кодов: (устанавливаемых в теги <i></i> и в Статусе Пользователя):
F1 - Cкрытый форум ( открываемый при записи в профиль
T1 - Cкрытая Тема ( открываемая при записи в профиль
f1 - Открытый форум ( скрываемый при записи в профиль
t1 - Открытая Teма ( скрываемая при записи в профильT1/F2 - Если скрываемая тема находится в закрытом форуме
(* - данный код - только в тегах <i>...</i> , в Статусе прописывается только код Темы)
В Cамое начало HTML низ
<!-- Доступ к Теме-Форуму по Коду в Статусе Ч2, HTML низ --> <script>MakeListOff();</script><script> $("#pun-userlist .usertable td.tc2").each(function(){ $(this).html($(this).html().replace(/,.*/,""));}); var LL=$("#pun-profile #profile-title strong"); LL.text(LL.text().replace(/,.*/,"")) $(".post .pa-title").each(function(i){ $(this).html($(this).html().replace(/,.*/,""));}); </script>
Пояснения:
1. Закрываемые и открываемые Форумы должны быть изначально - видны быть всем пользователям
2. Все прописанные Темы и Форумы в скрипте - автоматически скроются Скриптом от Гостей (в противном случае смысла в скрытии мало)
3. Все Прописанные темы и форумы в первых двух секциях - автоматически скроются от всех!
для открытия тем и форумов из этой секции, необходимо в Статусе соответствующего Юзера, дописать код открытия, через запятую.
Пример: Открыть некому Юзеру Форум F1 и тему T2
Статус,F1,T2
Черным - статус, Cиним - открываемые Форумы и Темы
4. Некое неудобство: Админы должны прописать себе для доступа в Статус все скрываемые Темы и Форумы из первых двух списков с кодами F и T (зато не будут сильно размножать списки)
5. Если скрываемая/открываемая тема (код Tx) находится в закрытом форуме, необходимо добавить в код в тегах <i>...</i> код данного Скрытого форума
поскольку скрипт должен открыть только данную тему, в данном форуме, остальные темы будут скрыты
Пример:
<i>T3/F2</i><a href="http://forum.mybb.ru/viewtopic.php?id=28190">Чайная</a>
Тема "чайная" находится в Скрытом форуме "Комната отдыха" с кодом F2 - добавляем /F2
6. Прописанные темы и форумы во вторых двух секциях - будут скрыты, если их коды Прописаны в Статусе соответствующего Юзера.
Пример: Закрыть некому Юзеру Форум f2 и тему t3
Статус,f2,t3
Черным - статус, Cиним - закрываемые Форумы и Темы
Поделиться8415.12.12 07:03
Скрипт выделения Блока код с одновременным копированием в буфер
DEMO
Жмём на синюю кнопку Код в Демке !
В HTML верх
<script>var swf_file='https://forumstatic.ru/files/000c/c1/da/68352.swf'</script>
<script type="text/javascript" src="https://forumstatic.ru/files/000c/c1/da/98903.js"></script>
<script type="text/javascript" src="http://hostjs-mybb2011.narod.ru/js/Block_codeCopy_toClipboard.js"></script><style type="text/css">
.punbb .code-box strong a{
color:#2B6D9F;
}
.code-box strong:hover a{
text-decoration:none;
color:#000;
}
</style>
Черным стиль кнопки Код (Можно менять на свой
В Спойлере данный Вариант работать не сможет, посколь флешка копирования текста позиционируется на блок .code-box strong , который будет скрыт спойлером и иметь нулевые размеры.
Поскольку блок код ограничен в стиле по высоте - данное применения с засовыванием в спойлер - избегайте!
Отредактировано Deff (16.12.12 23:47)
Поделиться8503.01.13 10:29
Скрипт падающих снежинок
<!--Снег кружится--> <html> <body> <script type="text/javascript"> var imgsrc="[color=red]Сюда вставляем адрес снежинки[/color]"; var col=40; var ie4=(document.all)?1:0; var ns6=(document.getElementById&&!document.all)?1:0; var height=(document.layers)?window.innerHeight:window.document.body.clientHeight; var width=(document.layers)?window.innerWidth:window.document.body.clientWidth; amp=new Array(); x_pos=new Array(); y_pos=new Array(); stx=new Array(); sty=new Array(); deltax=new Array(); obj=new Array(); for (i=0; i<col; ++i) { amp[i]=Math.random()*19; x_pos[i]=Math.random()*(width-49); y_pos[i]=Math.random()*height; stx[i]=0.03+Math.random()*0.15; sty[i]=0.8+Math.random(); deltax[i]=0; if (ie4||ns6) { document.write("<img id=\"sn"+ i +"\" style=\"position:absolute; z-index: "+ i +"; visibility:visible; top:-50px; left:-50px;\" src='"+imgsrc+"' border=0>"); } obj[i] = document.getElementById("sn"+i); } function flake() { for (i=0; i<col; ++i) { y_pos[i]+=sty[i]; if (y_pos[i]>height-49) { x_pos[i]=Math.random()*(width-amp[i]-29); y_pos[i]=0; } deltax[i]+=stx[i]; obj[i].style.top=y_pos[i]+"px"; obj[i].style.left=x_pos[i]+amp[i]*Math.sin(deltax[i])+"px"; } setTimeout("flake()", 20); } flake(); </script> </body> </html> <!--Конец снег кружится-->
Иногда внизу браузера появляется полоса прокрутки - снежинки вылазят за края браузера, может можно ограничить область падения автоматом, проверьте пож-ста... а так всё работает)
Посмотреть можно ТУТ
Поделиться8603.01.13 12:00
Ещё... на форуме мало снежинок, а при переходе по ссылкам, например - "новые сообщения" или "активны" снежинок много. Исправить можно это?
Поделиться8811.01.13 11:50
Mango-rzn,
<style> html { overflow-x: hidden; } </style>
В HTML-верх, скроет прокрутку.
Поделиться8911.01.13 15:59
Revolution
какую прокрутку? нижнюю, верхнюю или все?
Поделиться9011.01.13 16:53
lambdadelta,
overflow-x
предполагает, что по оси "X" =).