Единый форум поддержки

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » Единый форум поддержки » Архив » Обновленный спойлер


Обновленный спойлер

Сообщений 1 страница 20 из 328

1

И так меня просили приукрасить спойлер Карпова и вот что получилось http://tests.bestff.ru/viewtopic.php?id=16#p89
тем кому сие чудо по душе

1) html-верх

Код:
<script src="http://www.google.com/jsapi"></script>  
<script type="text/javascript">  
    google.load("jquery", "1.3.2");  
</script>

возможно этот код у вас уже стоит, если вы к примеру делали красиво-выплывающее меню

2) html-низ или форма ответа(если гости не могут просматривать форумы)

Код:
<style>
#button-spoiler {background-image:url('http://forumupload.ru/uploads/0000/12/13/488-1.gif'); padding:0; line-height:0; background-position:center; background-repeat:no-repeat; height:26px; width:100%}
</style>
<script type="text/javascript">
function tag_spoiler(){
	var y = prompt("Введите описание закрытой кнопки",'');
	if(y!='null' && y!='' && typeof(y)!='object' && typeof(y)!='undefined'){
	var x = prompt("Введите описание открытой кнопки",'');
	if(x=='null' || x=='' || typeof(x)=='object' || typeof(x)=='undefined') bbcode('[spoiler='+y+']','[/spoiler]'); else bbcode('[spoiler='+y+'|'+x+']','[/spoiler]');}
	else bbcode('[spoiler]','[/spoiler]')
}
function addSpoiler(str,from,internal){
	var pos=0,pos2=0,pos_c=0,pos_l=0,newpos=0,string='',close='',open='';
	if((pos=str.indexOf("[spoiler",from))==-1) return str;
	if((pos2=str.indexOf("[/spoiler]"),pos+9)==-1) return str;
	if(((pos_c=str.indexOf("]",pos+8))!=-1) && ((pos_c!=pos+8)&&(pos_c!=pos+9))){
	string = str.substring(pos+9,pos_c);
	if((pos_l = string.indexOf("|"))!=-1){
close = string.substring(0,pos_l);
open = string.substring(pos_l+1,string.length);
	}
	else{
close = string;
open = string;
	}
	}
	else{
close = 'Показать спойлер';
open = 'Скрыть спойлер';
	}
	newpos=str.indexOf("[spoiler",pos+9)
	if(newpos<pos2 && newpos!=-1) str=addSpoiler(str,pos+9,true)
	if((pos2=str.indexOf("[/spoiler]",pos+9))==-1) return str;
	str=str.substring(0,pos)+makeSpoiler(str.substring(pos_c+1,pos2),open,close)+str.substring(pos2+10,str.length)
	if( str.indexOf("[spoiler")!=-1 && internal==false) str=addSpoiler(str,0,false)
	return str;
}

function makeSpoiler(txt,open,close){
	txt='<div class="quote-box" style="padding:1px;background: none; border: 0;"><cite style="width:100%;margin:0;"><input id="'+open+'" class="spoiler-button" style="width:140px;font-size:10px; margin:0;" type="button" value="'+close+'"></cite><blockquote class="quote-box" style="display:none; width: 80%;border: 1px solid black;margin:0;">'+txt+'</blockquote></div>'
	return txt;
}

$(document).ready(function(){
	$("div.quote-box > cite > input.spoiler-button").click(function(){
$(this).parents("div.quote-box:first").find("blockquote.quote-box:first").toggle("slow");
var a = $(this).attr('value');$(this).attr('value',$(this).attr('id'));$(this).attr('id',a);
	});
});

if((document.URL.indexOf("viewtopic.php")!=-1) || (document.URL.indexOf("post.php")!=-1)){
	elm=document.getElementById("pun-main").getElementsByTagName("div")
	for(x in elm) if(elm[x].className=="post-content"){
var post=elm[x]
post.innerHTML=addSpoiler(post.innerHTML,0,false)
	}
}
if(form=document.getElementById("form-buttons"))
	form.getElementsByTagName("tr")[0].insertCell(16).innerHTML="<img  id=\"button-spoiler\" title=\"Спойлер\" onclick=\"tag_spoiler('[spoiler]','[/spoiler]')\" src=\"/i/blank.gif\" />"
</script>

Пробуйте ;)

+6

2

mkusher
Как избавиться от этого

0

3

в обед сегодня с другом поковырялись со скриптом,
добавили в скрипт возможность давать название-описание спойлеру
теперь это выглядит не просто - "Показать спойлер",
а всё что угодно - "Жми", "Новость", "Стихи" и т.д.
зачем мне это нужно? да потому что некоторые пользователи пугаются нового для себя слова - СПОЙЛЕР - что это?! а вдруг там вирус?!  :huh:  ропщут они,
что там за кот в мешке? а тут тебе кратко и ясно - Новость или Кот в мешке  :D

вот сам скрипт
то что вставлялось в html-верх, остаётся прежним

Код:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>

в html-низ вот это

Код:
<style>
#button-spoiler {background-image:url('http://forumupload.ru/uploads/0000/12/13/488-1.gif'); padding:0; line-height:0; background-position:center; background-repeat:no-repeat; height:26px; width:100%}
</style>
<script type="text/javascript">
function tag_spolier()
{var FoundErrors = '';
var enterTITLE = prompt("Введите описание спойлера", 'Спойлер');
bbcode('[spoiler]',('|'+enterTITLE+'[/spoiler]'));}
if(form=document.getElementById("form-buttons"))
form.getElementsByTagName("tr")[0].insertCell(19).innerHTML="<img src='/i/blank.gif' title='Вставить спойлер' id='button-spoiler' onclick=\"tag_spolier()\">"
function addSpoilerSpoiler(str,from,internal){
var pos=0,pos2=0,newpos=0
if((pos=str.indexOf("[spoiler]",from))==-1) return str;
if((pos2=str.indexOf("[/spoiler]"),pos+9)==-1) return str;
newpos=str.indexOf("[spoiler]",pos+9)
if(newpos<pos2 && newpos!=-1) str=addSpoiler(str,pos+9,true)
if((pos2=str.indexOf("[/spoiler]",pos+9))==-1) return str;

txt = str.substring(pos+9,pos2);
if((sepPos=txt.indexOf("|",0))==-1) return str;

str=str.substring(0,pos)+makeSpoilerSpoiler(txt.substring(0,sepPos),txt.substring(sepPos+1,txt.length))+str.substring(pos2+10,str.length)

if( str.indexOf("[spoiler]")!=-1 && internal==false) str=addSpoilerSpoiler(str,0,false)
return str}

function makeSpoilerSpoiler(txt1,txt2){
txt='<div class="quote-box" style="padding:1px;background: none;border: 0;"><cite style="width:100%;margin:0;"><input class="spoiler-button" style="width:140px;font-size:10px; margin:0; cursor: pointer" type="button" value="'+txt2+'"></cite><blockquote class="quote-box" style="display:none; width: 80%;border: 1px solid black;margin:0;">'+txt1+'</blockquote></div>'
return txt}

$(document).ready(function(){
     $("div.quote-box > cite > input.spoiler-button").click(function(){
$(this).parents("div.quote-box").find("blockquote.quote-box").toggle("normal");
     });
});


if((document.URL.indexOf("viewtopic.php")!=-1) || (document.URL.indexOf("post.php")!=-1)){
elm=document.getElementById("pun-main").getElementsByTagName("div")
for(x in elm) if(elm[x].className=="post-content"){
var post=elm[x]
post.innerHTML=addSpoilerSpoiler(post.innerHTML,0,false)}}
</script>

вот ПРИМЕР РАБОТЫ

Andatr@, а вроде симпатично кнопка стала выглядеть, да?

тег в данном скрипте имеет такой вид

Свернутый текст

блаблабла|описание спойлера

при выделении текста и нажатии кнопки всё вставляется автоматически, пробуйте всё там понятно, НО
старые спойлеры обрабатываемые предыдущим скриптом придётся доработать вручную поставив в конце текста внутри спойлера описание - |описание[/spoiler]

что касается спойлера внутри спойлера, надеюсь mkusher этим нас скоро обрадует

Отредактировано Romych (Пт, 11 Июн 2010 09:29:12)

+4

4

Ура, вот он с исправленной ошибкой. Теперь спойлер в спойлере и никаких проблем

Код:
<style type="text/css">
#button-spoiler {background-image:url('http://forumupload.ru/uploads/0000/12/13/488-1.gif'); padding:0; line-height:0; background-position:center; background-repeat:no-repeat}
</style>
<script>
function addSpoiler(str,from,internal){
var pos=0,pos2=0,newpos=0
if((pos=str.indexOf("[spoiler]",from))==-1) return str;
if((pos2=str.indexOf("[/spoiler]"),pos+9)==-1) return str;
newpos=str.indexOf("[spoiler]",pos+9)
if(newpos<pos2 && newpos!=-1) str=addSpoiler(str,pos+9,true)
if((pos2=str.indexOf("[/spoiler]",pos+9))==-1) return str;
str=str.substring(0,pos)+makeSpoiler(str.substring(pos+9,pos2))+str.substring(pos2+10,str.length)
if( str.indexOf("[spoiler]")!=-1 && internal==false) str=addSpoiler(str,0,false)
return str}

function makeSpoiler(txt){
txt='<div class="quote-box" style="padding:1px;background: none; border: 0;"><cite style="width:100%;margin:0;"><input class="spoiler-button" style="width:140px;font-size:10px; margin:0;" type="button" value="Показать cпойлер"></cite><blockquote class="quote-box" style="display:none; width: 80%;border: 1px solid black;margin:0;">'+txt+'</blockquote></div>'
return txt}

$(document).ready(function(){
	$("div.quote-box > cite > input.spoiler-button").click(function(){
$(this).parents("div.quote-box:first").find("blockquote.quote-box:first").toggle("normal");
if($(this).attr('value')=='Показать cпойлер'){$(this).attr('value','Скрыть спойлер')}else{$(this).attr('value','Показать cпойлер')}
	});
});

if((document.URL.indexOf("viewtopic.php")!=-1) || (document.URL.indexOf("post.php")!=-1)){
elm=document.getElementById("pun-main").getElementsByTagName("div")
for(x in elm) if(elm[x].className=="post-content"){
var post=elm[x]
post.innerHTML=addSpoiler(post.innerHTML,0,false)}}
if(form=document.getElementById("form-buttons"))
form.getElementsByTagName("tr")[0].insertCell(19).innerHTML="<img  id=\"button-spoiler\" title=\"Спойлер\" onclick=\"bbcode('[spoiler]','[/spoiler]')\" src=\"/i/blank.gif\" />"
</script>

старый код из хтмл-низа меняете на этот. Пример чудо работы спойлера http://tests.bestff.ru/viewtopic.php?id=7&p=2#p81

+2

5

Пример доработки http://tests.bestff.ru/viewtopic.php?id=16#p89

Код:
<style>
#button-spoiler {background-image:url('http://forumupload.ru/uploads/0000/12/13/488-1.gif'); padding:0; line-height:0; background-position:center; background-repeat:no-repeat; height:26px; width:100%}
</style>
<script type="text/javascript">
function tag_spoiler(){
	var y = prompt("Введите описание закрытой кнопки",'');
	if(y!='null' && y!='' && typeof(y)!='object' && typeof(y)!='undefined'){
	var x = prompt("Введите описание открытой кнопки",'');
	if(x=='null' || x=='' || typeof(x)=='object' || typeof(x)=='undefined') bbcode('[spoiler='+y+']','[/spoiler]'); else bbcode('[spoiler='+y+'|'+x+']','[/spoiler]');}
	else bbcode('[spoiler]','[/spoiler]')
}
function addSpoiler(str,from,internal){
	var pos=0,pos2=0,pos_c=0,pos_l=0,newpos=0,string='',close='',open='';
	if((pos=str.indexOf("[spoiler",from))==-1) return str;
	if((pos2=str.indexOf("[/spoiler]"),pos+9)==-1) return str;
	if(((pos_c=str.indexOf("]",pos+8))!=-1) && ((pos_c!=pos+8)&&(pos_c!=pos+9))){
	string = str.substring(pos+9,pos_c);
	if((pos_l = string.indexOf("|"))!=-1){
close = string.substring(0,pos_l);
open = string.substring(pos_l+1,string.length);
	}
	else{
close = string;
open = string;
	}
	}
	else{
close = 'Показать спойлер';
open = 'Скрыть спойлер';
	}
	newpos=str.indexOf("[spoiler",pos+9)
	if(newpos<pos2 && newpos!=-1) str=addSpoiler(str,pos+9,true)
	if((pos2=str.indexOf("[/spoiler]",pos+9))==-1) return str;
	str=str.substring(0,pos)+makeSpoiler(str.substring(pos_c+1,pos2),open,close)+str.substring(pos2+10,str.length)
	if( str.indexOf("[spoiler")!=-1 && internal==false) str=addSpoiler(str,0,false)
	return str;
}

function makeSpoiler(txt,open,close){
	txt='<div class="quote-box" style="padding:1px;background: none; border: 0;"><cite style="width:100%;margin:0;"><input id="'+open+'" class="spoiler-button" style="width:140px;font-size:10px; margin:0;" type="button" value="'+close+'"></cite><blockquote class="quote-box" style="display:none; width: 80%;border: 1px solid black;margin:0;">'+txt+'</blockquote></div>'
	return txt;
}

$(document).ready(function(){
	$("div.quote-box > cite > input.spoiler-button").click(function(){
$(this).parents("div.quote-box:first").find("blockquote.quote-box:first").toggle("slow");
var a = $(this).attr('value');$(this).attr('value',$(this).attr('id'));$(this).attr('id',a);
	});
});

if((document.URL.indexOf("viewtopic.php")!=-1) || (document.URL.indexOf("post.php")!=-1)){
	elm=document.getElementById("pun-main").getElementsByTagName("div")
	for(x in elm) if(elm[x].className=="post-content"){
var post=elm[x]
post.innerHTML=addSpoiler(post.innerHTML,0,false)
	}
}
if(form=document.getElementById("form-buttons"))
	form.getElementsByTagName("tr")[0].insertCell(16).innerHTML="<img  id=\"button-spoiler\" title=\"Спойлер\" onclick=\"tag_spoiler('[spoiler]','[/spoiler]')\" src=\"/i/blank.gif\" />"
</script>

хтмл-низ, заменить старое, если таковое было

+4

6

Во-первых, хочется похвалить - действительно, шикарная идея и хорошо воплотили. :cool:

тока вот мне что не понравилось:

Код:
[spoiler=это вот такая вот длиннющая описушка для кнопки]
блаблабла
[/spoiler]

посмотреть можно здесь: http://oaotr.0pk.ru/viewtopic.php?id=43&p=2#p163

http://s002.radikal.ru/i199/1002/d2/2c4379db8595.jpg

Возможно ли в скрипт добавить ограничение на ввод описания по количеству символов (включая пробелы)?
На моем форуме уж точно нужна подобная "защита от дурака". ^^

Отредактировано Герда (Вт, 2 Фев 2010 02:15:58)

0

7

Код:
<style>
#button-spoiler {background-image:url('http://forumupload.ru/uploads/0000/12/13/488-1.gif'); padding:0; line-height:0; background-position:center; background-repeat:no-repeat; height:26px; width:100%}
</style>
<script type="text/javascript">
function tag_spoiler(){
	var y = prompt("Введите описание закрытой кнопки",'');
	if(y!='null' && y!='' && typeof(y)!='object' && typeof(y)!='undefined'){
	var x = prompt("Введите описание открытой кнопки",'');
	if(x=='null' || x=='' || typeof(x)=='object' || typeof(x)=='undefined') bbcode('[spoiler='+y+']','[/spoiler]'); else bbcode('[spoiler='+y+'|'+x+']','[/spoiler]');}
	else bbcode('[spoiler]','[/spoiler]')
}
function addSpoiler(str,from,internal){
	var pos=0,pos2=0,pos_c=0,pos_l=0,newpos=0,string='',close='',open='', 




max_length=19;




	if((pos=str.indexOf("[spoiler",from))==-1) return str;
	if((pos2=str.indexOf("[/spoiler]"),pos+9)==-1) return str;
	if(((pos_c=str.indexOf("]",pos+8))!=-1) && ((pos_c!=pos+8)&&(pos_c!=pos+9))){
	string = str.substring(pos+9,pos_c);
	if((pos_l = string.indexOf("|"))!=-1){
close = string.substring(0,pos_l);
open = string.substring(pos_l+1,string.length);
	}
	else{
close = string;
open = string;
	}
	}
	else{
close = 'Показать спойлер';
open = 'Скрыть спойлер';
	}
	open = (open.length > max_length) ? open.substring(0, max_length) : open;
	close = (close.length > max_length) ? close.substring(0, max_length) : close;
	newpos=str.indexOf("[spoiler",pos+9)
	if(newpos<pos2 && newpos!=-1) str=addSpoiler(str,pos+9,true)
	if((pos2=str.indexOf("[/spoiler]",pos+9))==-1) return str;
	str=str.substring(0,pos)+makeSpoiler(str.substring(pos_c+1,pos2),open,close)+str.substring(pos2+10,str.length)
	if( str.indexOf("[spoiler")!=-1 && internal==false) str=addSpoiler(str,0,false)
	return str;
}

function makeSpoiler(txt,open,close){
	txt='<div class="quote-box" style="padding:1px;background: none; border: 0;"><cite style="width:100%;margin:0;"><input id="'+open+'" class="spoiler-button" style="width:140px;font-size:10px; margin:0;" type="button" value="'+close+'"></cite><blockquote class="quote-box" style="display:none; width: 80%;border: 1px solid black;margin:0;">'+txt+'</blockquote></div>'
	return txt;
}

$(document).ready(function(){
	$("div.quote-box > cite > input.spoiler-button").click(function(){
$(this).parents("div.quote-box:first").find("blockquote.quote-box:first").toggle("slow");
var a = $(this).attr('value');$(this).attr('value',$(this).attr('id'));$(this).attr('id',a);
	});
});

if((document.URL.indexOf("viewtopic.php")!=-1) || (document.URL.indexOf("post.php")!=-1)){
	elm=document.getElementById("pun-main").getElementsByTagName("div")
	for(x in elm) if(elm[x].className=="post-content"){
var post=elm[x]
post.innerHTML=addSpoiler(post.innerHTML,0,false)
	}
}
if(form=document.getElementById("form-buttons"))
	form.getElementsByTagName("tr")[0].insertCell(16).innerHTML="<img  id=\"button-spoiler\" title=\"Спойлер\" onclick=\"tag_spoiler('[spoiler]','[/spoiler]')\" src=\"/i/blank.gif\" />"
</script>

находим строку "max_length=19;" Число 19 меняем на свое - это максимальное количество символов на кнопке, остальное обрежет

Код:
<script type="text/javascript" src="http://help4us.ru/include/js/jquery.js"></script>

не забывайте про jquery, но и не перенасыщайте им =)

[modteg]Все вопросы задавать в соответствующий раздел![/modteg]

0

8

mkusher
здесь можно спросить? если нет, пните уж, ладно )
просто куда поставить скрипт, чтобы гости тоже могли корректно видеть спойлер?

0

9

Тыква вредности
В ХТМЛ-низ. Если в форме ответа то не будет у гостей отображатся. У низ нет формы ответа.

+1

10

а можно сделать шире выплывающее поле?

0

11

Тыква вредности
Только увеличив ширину блока цитаты. Насколько мне известно, ибо в скрипте выплывающий контейнер имеет идентификатор такой же, как и у цитат.

0

12

rps
нет, у меня цитаты по всей доступной ширине расползаются, а выплывающее поле спойлера довольно узкое...

0

13

Тыква вредности
А можно где-то увидеть на Вашем форуме спойлер и цитату? Для сравнения? Ссылкой.

0

14

Тыква вредности написал(а):

а можно сделать шире выплывающее поле?

rps написал(а):

Только увеличив ширину блока цитаты. Насколько мне известно, ибо в скрипте выплывающий контейнер имеет идентификатор такой же, как и у цитат.

Можно, в этом, то есть в обновлённом можно.
Найдите в скрипте

txt='<div class="quote-box" style="padding:1px;background: none; border: 0;"><cite style="width:100%;margin:0;"><input id="'+open+'" class="spoiler-button" style="width:140px;font-size:10px; margin:0;" type="button" value="'+close+'"></cite><blockquote class="quote-box" style="display:none; width: 80%;border: 1px solid black;margin:0;">'+txt+'</blockquote></div>'
return txt;
}

Выделенное отвечает за ширину окна

+1

15

Good
м, спасибо

0

16

Good
Не увидел...

0

17

Во всех спойлерах  не работает минимум переход по внешней ссылки ?

0

18

HAUSE M.D.
Здравствуйте.

HAUSE M.D. написал(а):

Во всех спойлерах  не работает минимум переход по внешней ссылки ?

Не проверяли. Дайте адрес на тему с такой ссылкой в спойлере.

0

19

rps написал(а):

Не проверяли. Дайте адрес на тему с такой ссылкой в спойлере.

Здравствуйте
http://topmobile.wesky.ru/viewtopic.php?id=758#p890

0

20

хм... сегодня спойлер почему-то работать перестал... причем на двух форумах, где я его ставила...  :dontknow:

0


Вы здесь » Единый форум поддержки » Архив » Обновленный спойлер