Тег spoiler как у Рутора.

[Drabodan 1]

http://TNT-Torrent.org

Здравствуйте Многоуважаемые Вэб Мастера и Служба Поддержки)))

Доброго времени суток))

Извините пожалуйста, что беспокою.

Не поможет кто нибудь пожалуйста, как сделать тег spoiler как у рутора красивый?

Вот как у них http://i47.fastpic.ru/big/2012/1125/aa/4df47ef7a64ab3294251fb934d3b6faa.png

И вот как безобразно у меня http://i47.fastpic.ru/big/2012/1125/41/2626130f5266f904d1f5ead46f971341.png

Заранее буду Вам Безумно Благодарен!!!

В исходнике странички игры это:

<div class="hidewrap"><div class="ead" onclick="hideshow($(this))">Особенности игры</div><div class="hidebody"></div><textarea class="hidearea"><br />

ТЕКСТ Описание игры БЛА БЛА БЛА

</textarea></div>

Нашел у них в http://s.rutor.org/css.css

/* [hide] start */

.hidewrap

{

margin-left: 10px;

border: 1px solid #C3CBD1;

margin: 5px;

z-index: 100;

}

.hidehead

{

background-color: #E9E9E6;

font-weight: bold;

padding: 3px;

padding-left: 20px;

background-image: url(http://s.rutor.org/t/icon_plus_1.gif);

background-repeat: no-repeat;

background-position: 6px 6px;

cursor: pointer;

}

.hidebody

{

border-top: 1px solid #C3CBD1;

padding: 3px;

display: none;

background-color: #F5F5F5;

}

.hidearea

{

display: none;

}

/* [hide] end */

Вставил кусок в свой css и теги див класса в новость, ничего не получилось.

Здесь http://s.rutor.org/t/functions.js нашел этот кусок

function hideshow(me)

{

var thisvar = me.next('div');

if (thisvar.css('display') == 'none')

{

thisvar.html(thisvar.next('textarea').val());

thisvar.css('display', 'block');

me.css('background-image', 'url(http://s.rutor.org/t/icon_minus_1.gif)');

}

else

{

thisvar.html('');

thisvar.css('display', 'none');

me.css('background-image', 'url(http://s.rutor.org/t/icon_plus_1.gif)');

}

}

Создал тоже файл functions.js продублировал код

Подключил стили в fullstory.tpl

<script type="text/javascript" src="http://tnt-torrent.org/путь к файлу/functions.js"></script>

Вставил в нужном месте в новости

<div class="hidewrap"><div class="hidehead" onclick="hideshow($(this))">Особенности игры</div><div class="hidebody"></div><textarea class="hidearea"><br />

ТЕКСТ

</textarea></div>

В стилях css прописал разумеется от /* [hide] start */ до /* [hide] end */

Не работает.

Вот что получается http://i48.fastpic.ru/big/2012/1125/e8/d9e74aac6f92c2a0526039bec3ca7ee8.png

И ещё: если вернуться в редактирование новости (после того как вставлял то что выше) там пропадает часть кода, остается только

<div class="hidewrap"><div class="hidehead">Особенности игры</div><div class="hidebody"></div><textarea class="hidearea">

ТЕКСТ

</textarea></div>

Тобеж вот это пропадает "onclick="hideshow($(this))" сколько я ни страюсь вствлять.

[Lomot 134]

Нужно только чуть-чуть подпраить свой файл стилей. Скрипты и слои с руторга копировать не надо.

[Drabodan 1]

В Engine.css прописал

/*---Цитата и скрытый текст---*/

.scriptcode, .title_quote,.quote, .title_spoiler, .text_spoiler {

padding: 5px;

background: #f9fafa;

border: 1px solid #dce7e7;

}

.title_quote, .title_spoiler {

background: #f9fafa;

}

.title_quote {

border-bottom: 0;

font-weight: bold;

}

.scriptcode {

color: #004e8d;

text-align: left;

font-family: "Courier New";

}

.title_spoiler {

font-weight: bold;

margin: 5px;

}

.text_spoiler {

border-top: 0;

text-align: justify;

margin: 5px;

}

.hide {

background-color: #e8f3fa;

padding: 5px;

color: #3a78a5;

margin: 0 0 1em;

}

.hide a {

text-decoration: underline;

}

.hide a:hover {

text-decoration: none ;

}

.inhide {

border: 1px solid #d1e3ef;

padding: 5px;

background-color: #fff;

margin-bottom: 5px;

}

Казалось бы всё хорошо..НО вот белая линия между блоками, когда нажимаешь на спойлер (то что она между блоками ДО нажатии на спойлеры это хорошо)

http://i48.fastpic.ru/big/2012/1126/47/dd4e0639b0853efac277a0231919f647.png

http://i48.fastpic.ru/big/2012/1126/bd/d55a542401c6d103b7095a5515e8b6bd.png надо чтобы как рутора при нажатии на спойлер был единый блок..эксперементировал..эксперементировал..не получается.

Получается единый блок только тогда когда ДО нажатия на спойлер тоже всё едино (замкнутый круг)

http://i48.fastpic.ru/big/2012/1126/47/4fa209cd624637a38b46513f73eee447.png

http://rutor.org/torrent/222764/gta-4_grand-theft-auto-iv-mods-realizm-mod-2008-2010-pc-repack вот у рутора при нажатии на спойлер блок ЕДИНЫЙ идет без разрывов..а расстояние только между рядом стоящими спойлерами (как и должно быть) А у меня при нажатии едино но остальные спойлеры липнут (получается все как один единый большой блок) , а если расстояние между чужими спойлерами у меня есть то при нажатии тоже разрыв.

[Drabodan 1]

Точно!! У рутора же тег </br> который делает эти разрывы)))))))))))