Спойлер и Safari

InstantCMS 2.X

Спойлеры в instantcms не работают в браузере safari

#1 17 июля 2017 в 21:17

В новых версиях инстанта в комментариях имеется спойлер.
Но, как выяснилось, на эппловых устройствах он не работает. Ни на мобильных устройствах ни на ноутбуках.
Я поставил даже сафари для винды — на ней тоже не работает.
Спойлер видно, выглядит также, как на остальных браузерах, но при нажатии скрытый текст не появляется, просто плюс в кнопке превращается в минус.
Кто имеет тайные знания об устройстве сафари? Может подскажете, как решить эту проблему?

#2 18 июля 2017 в 00:02

Спойлер видно, выглядит также, как на остальных браузерах, но при нажатии скрытый текст не появляется, просто плюс в кнопке превращается в минус.
Ris

Тоже самое, этот браузер глючный какой-то, им кто-то пользуется? В нем даже ютуб не работает.

#3 18 июля 2017 в 06:37

Тоже самое, этот браузер глючный какой-то, им кто-то пользуется? В нем даже ютуб не работает.
Андрей

Несчастные эппловладельцы вынуждены им пользоваться. hoho

Сегодня в 07:25

#4 18 июля 2017 в 11:50

при переходе на ютуб появляется сообщение о том что браузер устарел и не поддерживается, но если его проигнорировать и продолжить просмотр сайта то вполне можно пользоваться.

#5 18 июля 2017 в 11:58

но если его проигнорировать и продолжить просмотр сайта то вполне можно пользоваться.
Нил™

Со спойлерами на инстанте такой метод не прокатывает…

#6 18 июля 2017 в 12:10

Ну вот спойлер.

Спойлер

содержимое спойлера

разве он у вас в сафари не открывается? У меня открывается.

Если в новой версии двойки не открывается, вероятно там какой нибудь из скриптов влияет, в консоли ошибок нет?

#7 18 июля 2017 в 12:18

Если в новой версии двойки не открывается, вероятно там какой нибудь из скриптов влияет, в консоли ошибок нет?
Нил™

Спойлеры из первой ветки нормально открываются. Они на яваскрипте:

Спойлер

        if (!$title) { $title = $_LANG['SPOILER']; }
        $str .= '<div class="bb_tag_spoiler">';
            $str .= '<div class="spoiler_title">
                        <strong>'.$this->cleanAttrValue($title).'</strong>
                        <input style="margin-left:10px" type="button" onclick="$(this).parent(\'div\').parent(\'div\').find(\'.spoiler_body\').slideToggle();   " value="'.$_LANG['SHOW'].'" />
                     </div>';
            $str .= '<div class="spoiler_body" style="display:none">';
                $str .= $this -> get_html($elem['val']);
            $str .= '</div>';
        $str .= '</div>';
        return $str;

Во второй ветке спойлер устроен по-другому

return '<div class="spoiler"><input tabindex="-1" type="checkbox" id="'.$id.'"><label for="'.$id.'">'.$title.'</label><div class="spoiler_body">'.$content.'</div></div>';

Никаких ошибок в консоли. Просто не открывается.

#8 18 июля 2017 в 12:19

Никаких ошибок в консоли. Просто не открывается.
Ris

Чекбокс не чекается по-видимому.

🛠 docs.instantcms.ru

#9 18 июля 2017 в 12:22

Чекбокс не чекается по-видимому.
Fuze

Чекается. Плюс ни минус меняется.
Начинаю в консоли убирать галки с каких-либо свойств (все равно каких, цвет шрифта, дисплей) — спойлер открывается.
Мистика…

#10 18 июля 2017 в 12:40

А тут работает переключатель?

🛠 docs.instantcms.ru

#11 18 июля 2017 в 14:47

А тут работает переключатель?
Fuze

Да, работает.

Провел эксперимент. Сделал html файлик как тут Pocus рассказывал: instantcms.ru/forum/thread26743-1.html
Вот так работает и в хроме и в сафари:

Спойлер

<style>
    .spoiler >  input + .box { display: none; }
    .spoiler >  input:checked + .box { display: block; }
</style>
 
<div class="spoiler">
     <input type="checkbox" >
     <div class="box">
          Текст сообщения в спойлере.
     </div>
</div>

Вот так в хроме работает, а в сафари — нет:

Спойлер

<style>
    .spoiler >  input + label + .box { display: none; }
    .spoiler >  input:checked + label + .box { display: block; }
</style>
 
<div class="spoiler">
     <input type="checkbox" id = "111111">
     <label for="111111">Spoiler</label><div class="box">
          Текст сообщения в спойлере.
     </div>
</div>

В общем взял код от спойлера из первой ветки:

Спойлер

content = this.getSelectionHtml();
 
 
				spoiler_name = prompt('Название спойлера', 'Спойлер');
 
 
				spoiler = '<div class="splr"><input style="padding: 3px;" type="button" onclick="$(this).parent(\'div\').find(\'.spoiler_body\').slideToggle();" value="'+spoiler_name+'">'+
			'<div class="spoiler_body" style="display: none">'+content+'</div></div>';
 
 
				this.insertHtmlAdvanced(spoiler);

Пока все юзеры довольны.

#12 19 июля 2017 в 09:19

В общем взял код от спойлера из первой ветки:
Ris

Если нет особых причин, можно на 1 уменьшить количество элементов и селекторов (<div class="bb_tag_spoiler">)
Ну и скриптику тогда не придётся искать и родителя и дедушку кнопки:

 
<input style="margin-left:10px" onclick="$(this).parent('div').next('.spoiler_body').slideToggle(); " value="Показать" type="button">

Украинский для инстант

#13 19 июля 2017 в 11:31

Олег Васильевич я,
Спасибо, вот так заработало:

'<input style="margin-left:10px" onclick="$(this).next(\'.spoiler_body\').slideToggle(100); " value="'+spoiler_name+'" type="button"><div class="spoiler_body" style="display: none">' + content + '</div>'

Проблемы с отображением меню 2

В редакторе не работает заливк

Вы не можете отвечать в этой теме.
Войдите или зарегистрируйтесь, чтобы писать на форуме.

Спойлер и Safari

Похожие темы

Скрыть под спойлер, как?...

Проблема со старыми браузерами.

Не работает кнопка купить в Safari и на iOS

Заключить группу полей под спойлер

Не могу редактировать типы контента

[ЗАКРЫТО] Спойлер в редакторе

InstantCMS Team

О проекте

Поддержка

Дополнения