Вопрос по спойлеру

Мод спойлера на аяксе для форума phpBB3
 • Просмотры: 5223
Li
Likan_TM
Благодарил (а): 8 раз
Сообщения: 101
Зарегистрирован: 20 сен 2009, 22:31
Сообщение

Вопрос по спойлеру

10 апр 2010, 16:44

Возможно ли добавить к спойлеру следующий функционал: чтобы при раскрытии спойлера внизу появлялась ссылка для сворачивания (например, "свернуть"). Данная вещь будет весьма удобна при скрытии под спойлер больших объемов текста. ;)
Аватара пользователя
PPK
Администратор
Благодарил (а): 82 раза
Поблагодарили: 1619 раз
Сообщения: 10275
Зарегистрирован: 21 мар 2009, 17:13
Сообщение

Вопрос по спойлеру

12 апр 2010, 12:25

Можно .. ;)
Аватара пользователя
TEK
Благодарил (а): 13 раз
Поблагодарили: 39 раз
Сообщения: 571
Зарегистрирован: 17 фев 2010, 21:23
Сообщение

Вопрос по спойлеру

22 апр 2010, 15:53

Вопрос по теме можно чтоб в названии спойлера былне только текст: была возможность отображения лого или скрина

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

[spoiler=ТУТ ТВОЁ НАЗВАНИЕ или скриншот(лого)]тут твоя инфа[/spoiler]
ПРИМЕР-смотрим в самой теме по сылке (отображение спойлера)

было бы неплохо такая модернизация спойлера
Аватара пользователя
serrrios
Благодарил (а): 11 раз
Поблагодарили: 119 раз
Сообщения: 1532
Зарегистрирован: 29 май 2009, 20:22
Сообщение

Вопрос по спойлеру

24 апр 2010, 12:21

Для этого надо чтоб была обработка бб-кодов, а как уже сказали в 4ом посте, не будет =(
http://aniproject.ru - перспектива... велком епта..
http://www.ppkbb3cker.ru/viewtopic.php?f=35&t=1042 - мои платные услуги по трекеру.
Аватара пользователя
TEK
Благодарил (а): 13 раз
Поблагодарили: 39 раз
Сообщения: 571
Зарегистрирован: 17 фев 2010, 21:23
Сообщение

Вопрос по спойлеру

11 май 2010, 16:59

serrrios писал(а):Для этого надо чтоб была обработка бб-кодов, а как уже сказали в 4ом посте, не будет =(
зря конечно - значит будем пытаться мудрить
gu
guru3000
Откуда: Ни.Но
Благодарил (а): 32 раза
Поблагодарили: 40 раз
Сообщения: 139
Зарегистрирован: 01 мар 2010, 13:42
Сообщение

Вопрос по спойлеру

15 июн 2010, 18:39

Будет ли выложена новая версия спойлера со всеми доработками которые используются в торрент-треккере? (ну там минусик в конце спойлера) 8-)
Аватара пользователя
PPK
Администратор
Благодарил (а): 82 раза
Поблагодарили: 1619 раз
Сообщения: 10275
Зарегистрирован: 21 мар 2009, 17:13
Сообщение

Вопрос по спойлеру

15 июн 2010, 19:24

Не знаю, нужен ли?, плюсик/минусик в конце можно конечно ;) , а вот fancybox и т.д. - если только отдельной веткой этот мод спойлера обозначить.
fi
filosof
Поблагодарили: 4 раза
Сообщения: 354
Зарегистрирован: 05 май 2010, 20:55
Сообщение

Вопрос по спойлеру

16 июн 2010, 06:44

TEK писал(а):Вопрос по теме можно чтоб в названии спойлера былне только текст: была возможность отображения лого или скрина

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

[spoiler=ТУТ ТВОЁ НАЗВАНИЕ или скриншот(лого)]тут твоя инфа[/spoiler]
ПРИМЕР-смотрим в самой теме по сылке (отображение спойлера)

было бы неплохо такая модернизация спойлера
вот что нагуглил по этому вопросу:
Относительно спойлеров для phpbb3.
Общий код выглядит так:

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

/* Code block------------------------------------------------*/
dl.codebox {
    padding: 3px;
    background-color: #ffffff; 
    border: 1px solid #C9D2D8;  
    font-size: 1em;      
    width: 60%; 
    }
dl.codebox dt {
    text-transform: uppercase;  
    border-bottom: 1px solid #CCCCCC; 
    margin-bottom: 3px;        
    font-size: 0.8em; 
    font-weight: bold;
    background-color: #fff;
    }
Что есть что:

dl.codebox - блок спойлера
padding: 3px; - расстояние между границами спойлера и его содержимым
background-color: #ffffff; - цвет фона блока
border: 1px solid #C9D2D8; - контур блока (толщина, сплошная линия, цвет)
font-size: 1em; - размер шрифта
width: 60%; - ширина блока

dl.codebox dt { - заголовок свернутого блока, надпись "Спойлер"
text-transform: uppercase; - заголовок пишется прописными буквами
border-bottom: 1px solid #CCCCCC; - черта, подчеркивающая заголовок "Спойлер" (толщина, сплошная линия, цвет)
margin-bottom: 3px; - отступ снизу
font-size: 0.8em; - размер шрифта
font-weight: bold; - толщина шрифта (жирный)
background-color: #fff; - цвет строки с заголовком "Спойлер"


Для того, чтобы сделать фоном изображение, нужно добавить код:

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

background: url('адрес изображения') center no-repeat;
Например, можно добавить изображение в заголовок, вместо надписи "Спойлер". Для этого в dl.codebox dt частично изменим / добавим:
b

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

order-bottom: 0px solid #CCCCCC;
   background: url('адрес изображения') center no-repeat;
   color: transparent;
   height: 50px;
где:
border-bottom: 0px - убираем подчеркивание под заголовком "Спойлер"
color: transparent - делаем надпись прозрачной
height: 50px - задаем высоту заголовка

В довершении - изменяем фон и обрамление всего спойлера.
Теперь весь код будет выглядеть так:

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

dl.codebox {
   padding: 15px;
   background-color: #E1EBF2;
   border: 2px dotted #fff;
   font-size: 1em;
   width: 60%;
   }
dl.codebox dt {
   text-transform: uppercase;
   border-bottom: 0px solid #CCCCCC;
   background: url('адрес изображения') center no-repeat;
   margin-bottom: 3px;
   font-size: 0.8em;
   font-weight: bold;
   display: block;
   background-color: #fff;
   color: transparent;
   height: 50px;
   }
Результат:



.............................................................................................................................................................

наш спойлер по адресу \tracker\addons\css выглядит сейчас так:

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

.sp-wrap			{ margin: 8px auto; }
.sp-wrap			{ width: 98%; clear: both; }
.sp-wrap .sp-wrap		{ margin: 2px auto 4px; }
.sp-wrap, .sp-head, .sp-body	{
	border: solid #C3CBD1; border-width: 1px 1px 1px 2px; clear: both;
}
.sp-body	{ padding: 2px 6px; }
.sp-head	{ text-align: left !important; }

.sp-wrap	{ padding: 0; background: #E9E9E6; }
.sp-head	{ border-width: 0; font-size: 11px; padding: 1px 14px 3px; margin-left: 6px; line-height: 15px; font-weight: bold; color: #2A2A2A; cursor: pointer; }
.sp-body	{ border-width: 1px 0 0 0; display: none; font-weight: normal; background: #F5F5F5; }

.clickable	{ cursor: pointer; }
.folded	{ display: block;
	background: transparent url(../images/spoiler/icon_plus_1.gif) no-repeat left center; padding-left: 14px; }
.unfolded	{ display: block;
	background: transparent url(../images/spoiler/icon_minus_1.gif) no-repeat left center; padding-left: 14px; }

var.postImgAligned {
	display: block;
}

img.postImg  { vertical-align: text-bottom; }
img.postImg        { margin: 2px 2px 0 0; }
img.postImgAligned { margin: 4px 4px 2px; }

.clear     { clear: both; height: 0; font-size: 0px; line-height: 0px; overflow: hidden; }
fi
filosof
Поблагодарили: 4 раза
Сообщения: 354
Зарегистрирован: 05 май 2010, 20:55
Сообщение

Вопрос по спойлеру

16 июн 2010, 06:51

Относительно спойлеров для phpbb2.
Общий код выглядит так:

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

.quote{
   font-family: Verdana,Arial,Helvetica,sans-serif;
   font-size: 13px;
   color: #000;
   background-color: #fff;
   background: url('изображение');
   border: #000 solid 1px;
}
Что есть что:
font-family - используемые шрифты
font-size: 13px - размер шрифта
color: #000; - цвет текста
background-color: #fff- цвет фона
background: url('изображение'); - фоновое изображение
border: #000 solid 1px; - контур блока (цвет, сплошная линия, толщина)

Например.
1) Можно задать фоновое изображение, сместить его в верхний правый угол и запретить повторять.
2) Установить минимальную высоту блока таким образом, чтобы фоновое изображение было видно при свернутом спойлере.
3) Задать отступ содержимого спойлера - сверху на высоту фонового изображения (чтобы они не сливались), на 5px по сторонам и 2px снизу.
4) Убрать бордюр, назначив ему нулевую толщину
Соответственно, добавляем / изменяем в коде:

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

 background: url('http://i17.servimg.com/u/f17/14/67/67/89/code110.png') top right no-repeat;
   min-height: 40px;
   padding: 40px 5px 2px;
   border: #d1d7dc solid 0px;
}
Теперь весь код будет выглядеть так:

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

.quote{
   font-family: Verdana,Arial,Helvetica,sans-serif;
   font-size: 13px;
   color: #754960;
   background: url('http://i17.servimg.com/u/f17/14/67/67/89/code110.png') top right no-repeat;
   background-color: #FFFEE2;
   border: #d1d7dc solid 0px;
   min-height: 40px;
   padding: 40px 5px 2px;
}
Результат (свернутый и развернутый спойлеры):



............................................................................................................................
вопрос: подойдет ли все, что я понаписал выше, для нас?
Аватара пользователя
PPK
Администратор
Благодарил (а): 82 раза
Поблагодарили: 1619 раз
Сообщения: 10275
Зарегистрирован: 21 мар 2009, 17:13
Сообщение

Вопрос по спойлеру

17 июн 2010, 11:57

Я из всего этого обнаружил только возможность вставлять картинку вместо "Скрытый текст" и т.д. - если имелось ввиду именно это - то пока не планируется. ;)

Вернуться в «BB2Spoiler/BB3Spoiler»