Добрый подскажите код spoiler ✓ ЕСТЬ ОТВЕТ

Здесь обсуждается форумный движок phpBB различных версий. В дальнейшем, если понадобится, форум будет вынесен в отдельный подраздел и разбит на категории.
Ответить
Аватара пользователя

Автор темы
KISS_ARMY
Постоянный пользователь
Сообщения: 67
Зарегистрирован: 15 окт 2015, 06:03
Есть ответ: 4
Репутация: 2
Контактная информация:
Статус: Не в сети

Добрый подскажите код spoiler

Сообщение KISS_ARMY » 19 окт 2015, 20:23

Очень нравится spoiler который стоит тут подскажите его код

ЛУЧШИЙ ОТВЕТ DesignerMix » 19 окт 2015, 20:34
Этот спойлер делал я сам на основе спойлера с рутрекера и из-за этого код совсем некрасивый, но рабочий. Ссылки на картинки плюса и минуса смените на ваши.

Примеры:

Код: Выделить всё

[spoiler={TEXT1}]{TEXT2}[/spoiler]
Замена HTML:

Код: Выделить всё

<div style="padding: 10px 0px 5px 0px;"><!--spoiler-wrap-->
  <div style="
     width: 97%;
   margin-right: 6px;
   clear: both;
   background: rgb(244, 246, 251);
   border: solid rgb(204, 204, 255);
   border-width: 1px 1px 1px 1px;
   font: 12px Verdana,Arial,sans-serif;">
    <div style="
	   font-size: 11px;
   padding: 3px 3px 3px 15px;
   line-height: 15px;
   font-weight: bold;
   background: #F5E3D1;
padding-left: 6px;
   background-color: #FFF9EF;
      cursor: pointer;"
	  onclick="
	  hidn = this.parentNode.getElementsByTagName('div')[1]; 
	  btn = this.getElementsByTagName('img')[0]; 
	  if (hidn.style.display != '') { hidn.style.display = '';
	  orimg = btn.src; btn.src = 'styles/se_square_left/theme/images/minus.gif'; } else { 

hidn.style.display = 'none';
	  btn.src = orimg; }">
	<img style="margin: 0; padding: 2px 2px 0;" src="styles/se_square_left/theme/images/plus.gif" />
	  
 {TEXT1}
	  
	  </div>
      <!--spoiler-body-->
        <div style="line-height: 20px;
		padding: 10px 10px 10px 15px;
    display: none;
   border-top: 1px solid rgb(255, 255, 255);
   border-bottom: 0px solid rgb(255, 255, 255);
   border-left: 0px solid rgb(255, 255, 255);
   border-right: 0px solid rgb(255, 255, 255);
   background: rgb(244, 246, 251);
   border-style: solid;
    border-top-style: solid;
    border-right-style-value: solid;
    border-bottom-style: solid;
    border-left-style-value: solid;
    border-left-style-ltr-source: physical;
    border-left-style-rtl-source: physical;
    border-right-style-ltr-source: physical;
    border-right-style-rtl-source: physical;
	border-color: #C3CBD1;
    border-top-color: #C3CBD1;
    border-right-color-value: #C3CBD1;
    border-bottom-color: #C3CBD1;
-moz-border-top-colors: none;
-moz-border-bottom-colors: none;">

{TEXT2}

</div>
      <!--/spoiler-body-->
  </div>
<!--/spoiler-wrap-->
</div>
Пример спойлера
Текст в спойлере

ПЕРЕЙТИ К ПОЛНОМУ СООБЩЕНИЮ ➙

Теги:

Аватара пользователя

DesignerMix
Администратор
Администратор
Сообщения: 5146
Зарегистрирован: 25 апр 2014, 10:51
Есть ответ: 189
Репутация: 595
Откуда: Белгород
Контактная информация:
Статус: Не в сети

Добрый подскажите код spoiler

Сообщение DesignerMix » 19 окт 2015, 20:34

Этот спойлер делал я сам на основе спойлера с рутрекера и из-за этого код совсем некрасивый, но рабочий. Ссылки на картинки плюса и минуса смените на ваши.

Примеры:

Код: Выделить всё

[spoiler={TEXT1}]{TEXT2}[/spoiler]
Замена HTML:

Код: Выделить всё

<div style="padding: 10px 0px 5px 0px;"><!--spoiler-wrap-->
  <div style="
     width: 97%;
   margin-right: 6px;
   clear: both;
   background: rgb(244, 246, 251);
   border: solid rgb(204, 204, 255);
   border-width: 1px 1px 1px 1px;
   font: 12px Verdana,Arial,sans-serif;">
    <div style="
	   font-size: 11px;
   padding: 3px 3px 3px 15px;
   line-height: 15px;
   font-weight: bold;
   background: #F5E3D1;
padding-left: 6px;
   background-color: #FFF9EF;
      cursor: pointer;"
	  onclick="
	  hidn = this.parentNode.getElementsByTagName('div')[1]; 
	  btn = this.getElementsByTagName('img')[0]; 
	  if (hidn.style.display != '') { hidn.style.display = '';
	  orimg = btn.src; btn.src = 'styles/se_square_left/theme/images/minus.gif'; } else { 

hidn.style.display = 'none';
	  btn.src = orimg; }">
	<img style="margin: 0; padding: 2px 2px 0;" src="styles/se_square_left/theme/images/plus.gif" />
	  
 {TEXT1}
	  
	  </div>
      <!--spoiler-body-->
        <div style="line-height: 20px;
		padding: 10px 10px 10px 15px;
    display: none;
   border-top: 1px solid rgb(255, 255, 255);
   border-bottom: 0px solid rgb(255, 255, 255);
   border-left: 0px solid rgb(255, 255, 255);
   border-right: 0px solid rgb(255, 255, 255);
   background: rgb(244, 246, 251);
   border-style: solid;
    border-top-style: solid;
    border-right-style-value: solid;
    border-bottom-style: solid;
    border-left-style-value: solid;
    border-left-style-ltr-source: physical;
    border-left-style-rtl-source: physical;
    border-right-style-ltr-source: physical;
    border-right-style-rtl-source: physical;
	border-color: #C3CBD1;
    border-top-color: #C3CBD1;
    border-right-color-value: #C3CBD1;
    border-bottom-color: #C3CBD1;
-moz-border-top-colors: none;
-moz-border-bottom-colors: none;">

{TEXT2}

</div>
      <!--/spoiler-body-->
  </div>
<!--/spoiler-wrap-->
</div>
Пример спойлера
Текст в спойлере

Ответить

Вернуться в «Движок phpBB»

Кто сейчас на конференции

Сейчас этот форум просматривают: нет зарегистрированных пользователей и 1 гость