X   Сообщение сайта
(Сообщение закроется через 2 секунды)

Здравствуйте, гость ( Вход | Регистрация )

2 страниц Открыть меню   1 2 >  
Ответить в данную темуНачать новую тему
> bb-код Spoiler
Phoenix84
сообщение 2010-10-02, 15:04
Сообщение #1
Любитель
Иконка группы

Группа: Eleanor user
Сообщений: 231
Регистрация: 2010-03-31
Версия системы: RC5

Репутация:   нет  
Всего: нет


Окончил свои тесты. Вроде все работает как и должно :)
Дублирую тему со своего сайта.

Метод 1. Он простой, но без красивостей

Итак приступим. Мы будем приделывать модуль спойлера из форумного движка Vbulletin.
Редактируем файл /classes/others/class_ownbb.php
В конец файла (но перед ?>)добавляем:

Цитата
# спойлер
class OwnBbCode_spoiler extends BaseOwnBbCode
{
    public function PreDisplay($tag,$params,$content,$canuse)
    {
        if(!$canuse)
            return $this->RestrictDisplay();
        $params=$params ? Strings::ParseParams($params) : array();
        if(isset($params['noparse']))
        {
            unset($params['noparse']);
            return parent::PreEdit($tag,$params,$content,true);
        }
        If (!isset($params['name'])) {
         $params['name']=' >>> Спойлер';}
        return '<div style="margin:20px; margin-top:5px"><div class="smallfont" style="margin-bottom:2px"><b>'.$params['name'].' </b><input type="button" value="Показать" style="width:60px;height:17px;font-size:10px;margin:0px;padding:0px;" onClick="if (this.parentNode.parentNode.getElementsByTagName(\'div\')[1].getElementsByTagName(\'div\')[0].style<</span></span></span>/span>.display != \'\') { this.parentNode.parentNode.getElementsByTagName(\'div\')[1].getElementsByTagName(\'div\')[0].style.display = \'\'; this.innerText = \'\'; this.value = \'Скрыть\'; } else { this.parentNode.parentNode.getElementsByTagName(\'div\')[1].getElementsByTagName(\'div\')[0].style.<</span></span></span>/span>display = \'none\'; this.innerText = \'\'; this.value = \'Показать\'; }"></div><div class="alt2" style="margin: 0px; padding: 6px; border: 1px inset;"><div style="display: none;">'.$content.'</div></div></div>';
    }
}


Вот и все. Теперь в админке создаем bb-код с названием spoiler, и можно использовать.
Спойлеру можно задавать имя с помощью spoiler name="Здесь можно задать имя"

Метод 2. Он сложнее, с участием AJAX, но красивее

Заходим в templates/Uniel/index.php и вставляем код ниже между тегами <head></head>
Цитата
<script type="text/javascript">
$(document).ready(function(){
$('.splLink').click(function(){
$(this).parent().children('div.splCont').toggle('normal');
return false;
});
});
</script>


Далее заходим в templates/Uniel/styles/base.css (можно в любой другой файл стиля) и добавляем строчку
Цитата
.splCont{display:none;border:1px solid #cccccc;padding:3px 5px;}


Теперь редактируем файл /classes/others/class_ownbb.php и вставляем туда
Цитата
# спойлер
class OwnBbCode_spoiler extends BaseOwnBbCode
{
    public function PreDisplay($tag,$params,$content,$canuse)
    {
        if(!$canuse)
            return $this->RestrictDisplay();
        $params=$params ? Strings::ParseParams($params) : array();
        if(isset($params['noparse']))
        {
            unset($params['noparse']);
            return parent::PreEdit($tag,$params,$content,true);
        }
        If (!isset($params['name'])) {
         $params['name']=' >>> Спойлер';}
        return '<div><div class="smallfont" style="margin-bottom:2px"><b>'.$params['name'].'</b> <input type="button" value="Показать" style="width:60px;height:17px;font-size:10px;margin:0px;padding:0px;" onClick="javascript://" class="splLink"><div class="splCont">'.$content.'</div></div></div>';
    }
}


Вот и все. Теперь в админке создаем bb-код с названием spoiler, и можно использовать.
Спойлеру можно задавать имя с помощью spoiler name="Здесь можно задать имя"

Пример: Где то тут :)

P.S. В спойлерах аттачные картинки отображаются

Сообщение отредактировал Phoenix84 - 2010-10-02, 18:26
Перейти в начало страницы
+Цитировать сообщение
Loader
сообщение 2010-10-02, 17:28
Сообщение #2
Профессионал
Иконка группы

Группа: Eleanor user
Сообщений: 1 161
Регистрация: 2010-04-19

Репутация:   нет  
Всего: нет


Чёт внешний вид не айс! Текст этот с кнопкой.
Может можно как-то сделать как ЗДЕСЬ
Перейти в начало страницы
+Цитировать сообщение
Phoenix84
сообщение 2010-10-02, 17:33
Сообщение #3
Любитель
Иконка группы

Группа: Eleanor user
Сообщений: 231
Регистрация: 2010-03-31
Версия системы: RC5

Репутация:   нет  
Всего: нет


Можно настроить как угодно :) Мне нравится этот внешний вид, нежели старый
Перейти в начало страницы
+Цитировать сообщение
Loader
сообщение 2010-10-02, 17:35
Сообщение #4
Профессионал
Иконка группы

Группа: Eleanor user
Сообщений: 1 161
Регистрация: 2010-04-19

Репутация:   нет  
Всего: нет


Цитата (Phoenix84 @ 2010-10-02, 17:33)
Можно настроить как угодно :) Мне нравится этот внешний вид, нежели старый


Как это сделать?
Перейти в начало страницы
+Цитировать сообщение
Phoenix84
сообщение 2010-10-02, 17:36
Сообщение #5
Любитель
Иконка группы

Группа: Eleanor user
Сообщений: 231
Регистрация: 2010-03-31
Версия системы: RC5

Репутация:   нет  
Всего: нет


После return идет код вывода. Вот его и подстраиваешь под себя сохраняя функциональность...
Перейти в начало страницы
+Цитировать сообщение
Phoenix84
сообщение 2010-10-02, 17:47
Сообщение #6
Любитель
Иконка группы

Группа: Eleanor user
Сообщений: 231
Регистрация: 2010-03-31
Версия системы: RC5

Репутация:   нет  
Всего: нет


Попробую сейчас сделать 3й вариант. Special for you)))
Перейти в начало страницы
+Цитировать сообщение
Loader
сообщение 2010-10-02, 18:07
Сообщение #7
Профессионал
Иконка группы

Группа: Eleanor user
Сообщений: 1 161
Регистрация: 2010-04-19

Репутация:   нет  
Всего: нет


Спасибо, доктор! :)

А чем отличается 1-й вариант от 2-го?
Для меня это выражается в том, что 2-й вариант не работает: спойлер не открывается :(
Перейти в начало страницы
+Цитировать сообщение
Phoenix84
сообщение 2010-10-02, 18:23
Сообщение #8
Любитель
Иконка группы

Группа: Eleanor user
Сообщений: 231
Регистрация: 2010-03-31
Версия системы: RC5

Репутация:   нет  
Всего: нет


2 вариант работает на аяксе. Он плавно появляется и скрывается
Скрипт точно перед </head> поставил?

Сообщение отредактировал Phoenix84 - 2010-10-02, 18:27
Перейти в начало страницы
+Цитировать сообщение
Loader
сообщение 2010-10-02, 18:32
Сообщение #9
Профессионал
Иконка группы

Группа: Eleanor user
Сообщений: 1 161
Регистрация: 2010-04-19

Репутация:   нет  
Всего: нет


Цитата (Phoenix84 @ 2010-10-02, 18:23)
2 вариант работает на аяксе. Он плавно появляется и скрывается
Скрипт точно перед </head> поставил?


Ты не понял, он у меня на твоём сайте не работает!

http://technophoenix.ru/articles/web/spoyler-dlya-eleanor-cms.html
Перейти в начало страницы
+Цитировать сообщение
Phoenix84
сообщение 2010-10-02, 18:44
Сообщение #10
Любитель
Иконка группы

Группа: Eleanor user
Сообщений: 231
Регистрация: 2010-03-31
Версия системы: RC5

Репутация:   нет  
Всего: нет


А у меня работает О_о
Браузер какой?
Странно, но у меня не работает только в Опере

Сообщение отредактировал Phoenix84 - 2010-10-02, 18:46
Перейти в начало страницы
+Цитировать сообщение
Loader
сообщение 2010-10-02, 18:47
Сообщение #11
Профессионал
Иконка группы

Группа: Eleanor user
Сообщений: 1 161
Регистрация: 2010-04-19

Репутация:   нет  
Всего: нет


Опера и есть!
А Эксплорер жёстко глючит на той странице! И загрузка ЦП ой-ёй-ёй :)

Сообщение отредактировал Loader - 2010-10-02, 18:48
Перейти в начало страницы
+Цитировать сообщение
Phoenix84
сообщение 2010-10-02, 19:02
Сообщение #12
Любитель
Иконка группы

Группа: Eleanor user
Сообщений: 231
Регистрация: 2010-03-31
Версия системы: RC5

Репутация:   нет  
Всего: нет


Че то у меня не получается состряпать нормальный вид :(
В ж*пу осла, я юзаю Google Chrome и у меня все все работает :)

Сообщение отредактировал Phoenix84 - 2010-10-02, 19:03
Перейти в начало страницы
+Цитировать сообщение
Loader
сообщение 2010-10-02, 20:09
Сообщение #13
Профессионал
Иконка группы

Группа: Eleanor user
Сообщений: 1 161
Регистрация: 2010-04-19

Репутация:   нет  
Всего: нет


Дело в том что практически аналогичный 2-му варианту спойлер описан и прекрасно работает в опере здесь:
http://szenprogs.ru/blog/spojler_na...y/2009-10-28-71
может на его основе что смастерить попробуешь? :)

P.S. В осле также работает корректно.

Сообщение отредактировал Loader - 2010-10-02, 20:10
Перейти в начало страницы
+Цитировать сообщение
Phoenix84
сообщение 2010-10-02, 20:12
Сообщение #14
Любитель
Иконка группы

Группа: Eleanor user
Сообщений: 231
Регистрация: 2010-03-31
Версия системы: RC5

Репутация:   нет  
Всего: нет


Сопсна оттуда я его и сп*дил...
Перейти в начало страницы
+Цитировать сообщение
Loader
сообщение 2010-10-02, 20:17
Сообщение #15
Профессионал
Иконка группы

Группа: Eleanor user
Сообщений: 1 161
Регистрация: 2010-04-19

Репутация:   нет  
Всего: нет


ОМАГАТ!!!
А что же ТАКАЯ разница в работе??!

Сообщение отредактировал Loader - 2010-10-02, 20:30
Перейти в начало страницы
+Цитировать сообщение
Phoenix84
сообщение 2010-10-02, 20:26
Сообщение #16
Любитель
Иконка группы

Группа: Eleanor user
Сообщений: 231
Регистрация: 2010-03-31
Версия системы: RC5

Репутация:   нет  
Всего: нет


Объясняется все просто. Просто в элеанорке дофига других нужных подключенных библиотек. Которые могут друг друга перекрывать
Перейти в начало страницы
+Цитировать сообщение
Loader
сообщение 2010-10-02, 20:30
Сообщение #17
Профессионал
Иконка группы

Группа: Eleanor user
Сообщений: 1 161
Регистрация: 2010-04-19

Репутация:   нет  
Всего: нет


Собственно вот что я смастерил в виде html-файла:

Цитата
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Spoiler Example</title>
<style type="text/css">
.splCont{display:none;border:1px solid #cccccc;padding:3px 5px;}
</style>
<script type="text/javascript" src="http://pda-kino.net/js/jquery.min.js"></script>

<script type="text/javascript">
$(document).ready(function(){
$('.splLink').click(function(){
$(this).parent().children('div.splCont').toggle('normal');
return false;
});
});
</script>
</head>

<body>

<div><a href="javascript://" class="splLink">Спойлер...</a><div class="splCont">
тут текст, спрятанный внутри спойлера...
</div></div>

</body>
</html>


Всё прекрасно и всё работает и в опере! НО!!! Надо всё это адаптировать для элеанорки, желательно спойлер оформить как здесь:

http://forum.eleanor-cms.ru/go.php?...gin-t27452.html

(Но можно оставить как есть)

ПОМОГИТЕ!
Перейти в начало страницы
+Цитировать сообщение
Loader
сообщение 2010-10-02, 21:23
Сообщение #18
Профессионал
Иконка группы

Группа: Eleanor user
Сообщений: 1 161
Регистрация: 2010-04-19

Репутация:   нет  
Всего: нет


Наполовину перенёс этот спойлер в Элеанорку так:

Заходим в templates/Uniel/index.php и вставляем код ниже между тегами <head></head>

Цитата
<!-- Спойлер -->
<script type="text/javascript">
$(document).ready(function(){
$('.splLink').click(function(){
$(this).parent().children('div.splCont').toggle('normal');
return false;
});
});
</script>
<!-- Спойлер конец -->


Далее заходим в templates/Uniel/styles/base.css (можно в любой другой файл стиля) и добавляем строчку:

Цитата
.splCont{display:none;border:1px solid #cccccc;padding:3px 5px;}



А вот далее нам приходится вставлять спойлер через [dohtml] таким образом:

Цитата
[dohtml]<div><a href="javascript://" class="splLink">Спойлер...</a><div class="splCont">
тут текст, спрятанный внутри спойлера...
</div></div>[/dohtml]


И это ОЧЕНЬ неудобно! Как это всё преобразовать в [spoiler=Название]тут текст, спрятанный внутри спойлера...[/spoiler] ???
И как прикрутить оформление отсюда: http://etenclub.ru/board/Graficheskij-paket-oformleniya-ot-login-mogin-t27452.html

ПОМОГИТЕ!


P.S. Рейтинги работают, ява работает ничего не конфликтует, в опере работает!!!



Сообщение отредактировал Loader - 2010-10-02, 21:31
Перейти в начало страницы
+Цитировать сообщение
Phoenix84
сообщение 2010-10-02, 21:27
Сообщение #19
Любитель
Иконка группы

Группа: Eleanor user
Сообщений: 231
Регистрация: 2010-03-31
Версия системы: RC5

Репутация:   нет  
Всего: нет


Ты написал точно то же самое что и я...
Цитата
И это ОЧЕНЬ неудобно! Как это всё преобразовать в [spoiler=Название]тут текст, спрятанный внутри спойлера...[/spoiler] ???


Цитата
# спойлер
class OwnBbCode_spoiler extends BaseOwnBbCode
{
public function PreDisplay($tag,$params,$content,$canuse)
{
if(!$canuse)
return $this->RestrictDisplay();
$params=$params ? Strings::ParseParams($params) : array();
if(isset($params['noparse']))
{
unset($params['noparse']);
return parent::PreEdit($tag,$params,$content,true);
}
If (!isset($params['name'])) {
$params['name']=' >>> Спойлер';}
return '<div><a href="javascript://" class="splLink">'.$params['name'].'</a><div class="splCont">.'$content'.</div></div>';
}
}

Только придется использовать как [spoiler name=что то]

Сообщение отредактировал Phoenix84 - 2010-10-02, 21:29
Перейти в начало страницы
+Цитировать сообщение
Loader
сообщение 2010-10-02, 21:36
Сообщение #20
Профессионал
Иконка группы

Группа: Eleanor user
Сообщений: 1 161
Регистрация: 2010-04-19

Репутация:   нет  
Всего: нет


Цитата (Phoenix84 @ 2010-10-02, 21:27)
Ты написал точно то же самое что и я...


Ага, только у меня в Опере всё работает!

Пример здесь: http://pda-kino.net/news/boevik/bezvozvratnyy-put.html

Цитата (Phoenix84 @ 2010-10-02, 21:27)
Только придется использовать как [spoiler name=что то]


Вот результат, просто добавил код выше в /classes/others/class_ownbb.php:

Parse error: syntax error, unexpected T_VARIABLE in /var/www/pdaki192/data/www/pda-kino.net.ru/classes/others/class_ownbb.php on line 827

Сообщение отредактировал Loader - 2010-10-02, 21:42
Перейти в начало страницы
+Цитировать сообщение

2 страниц Открыть меню   1 2 >
Ответить в данную темуНачать новую тему
0 чел. читают эту тему (гостей: 0, скрытых пользователей: 0)
Пользователей: 0

 
RSS Текстовая версия 0.0382 сек.    11 запросов    GZIP включен    Сейчас: 2024-04-17, 1:16