Форум русской поддержки Joomla!® CMS
08.12.2016, 04:18:59 *
Добро пожаловать, Гость. Пожалуйста, войдите или зарегистрируйтесь.
Вам не пришло письмо с кодом активации?

Войти
   
   Начало   Поиск Joomla 3.0 FAQ Joomla 2.5 FAQ Joomla 1.5 FAQ Правила форума Новости Joomla Реклама Войти Регистрация Помощь  
Страниц: [1]   Вниз
  Добавить закладку  |  Печать  
Автор

Аккордеон кнопкой. Не подключается CSS стиль. Шаблон Protostar/

 (Прочитано 84 раз)
0 Пользователей и 1 Гость смотрят эту тему.
Dannik
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 108


« : 11.11.2016, 09:47:19 »

Всем привет! Хотел сделать спойлер в виде красивой кнопки. Ставлю div в редакторе, CSS код закидываю в темплейт CSS - не работает. Что не так то? Можете подсказать как подключить правильно? Желательно с примером если не затруднит.
Вот CSS.
Код:
.spoiler {
    display: block;
}

.btn {
    display: inline-block;
    border: none;
    border-radius: 4px;
    font-size: 12px;
    padding: 10px 20px;
    background: #2D89EF;
    color: #fff;
    font-family: Tahoma, sans-serif;
    cursor: pointer;
}

.spoiler input[type=checkbox] {
    display: none;
}

.text {
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 4px;
    margin: 12px 0 20px;
}

.spoiler input[type=checkbox] ~ .text {
    display: none;
}

.spoiler input[type=checkbox]:checked ~ .text {
    display: block;
}

Вот div

Код:
<div class="spoiler">
    <label>
        <input type="checkbox"/>
        <span class="btn">Быстрый просмотр</span>
        <div class="text">
            Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet aspernatur dolorem ducimus eaque! Alias assumenda, blanditiis dignissimos facilis fuga ipsam molestias necessitatibus nostrum numquam raesentium quo sed sit! Aut, vitae?
        </div>
    </label>
</div>

Нашел этот код здесь http://jsfiddle.net/NkYNL/
Записан
vipiusss
Профи
********

Репутация: +261/-8
Offline Offline

Пол: Мужской
Сообщений: 4573


Skype: renor_


« Ответ #1 : 11.11.2016, 10:57:28 »

может стили где-то пересекаются.
попробуйте добавить иные названия классов, например spoiler2, btn2, text2 и соответственно и в CSS изменить
Записан
Dannik
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 108


« Ответ #2 : 11.11.2016, 11:13:24 »

может стили где-то пересекаются.
попробуйте добавить иные названия классов, например spoiler2, btn2, text2 и соответственно и в CSS изменить
Поменял, все равно невыходит. Странно, редактор код меняет, а точнее добавляет ненужное. Ок, буду дальше копать
Записан
vipiusss
Профи
********

Репутация: +261/-8
Offline Offline

Пол: Мужской
Сообщений: 4573


Skype: renor_


« Ответ #3 : 11.11.2016, 11:16:19 »

Поменял, все равно невыходит. Странно, редактор код меняет, а точнее добавляет ненужное. Ок, буду дальше копать

Отключите редактор временно или поставьте JCE например и настройте:код резать не будет
Записан
Dannik
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 108


« Ответ #4 : 11.11.2016, 11:20:00 »

Отключите редактор временно или поставьте JCE например и настройте:код резать не будет
Отключил, все равно стили не подхватывает. Просто чекбокс со словом быстрый просмотр, а ниже текст
Записан
vipiusss
Профи
********

Репутация: +261/-8
Offline Offline

Пол: Мужской
Сообщений: 4573


Skype: renor_


« Ответ #5 : 11.11.2016, 11:24:53 »

покажите ссылку на страницу, где не работает.
можете в ЛС, если какие-то стеснения/неудобства
Записан
Dannik
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 108


« Ответ #6 : 11.11.2016, 11:44:18 »

покажите ссылку на страницу, где не работает.
можете в ЛС, если какие-то стеснения/неудобства
Отправил в личку
Записан
vipiusss
Профи
********

Репутация: +261/-8
Offline Offline

Пол: Мужской
Сообщений: 4573


Skype: renor_


« Ответ #7 : 11.11.2016, 11:48:42 »

я уже там, в личке написал.
продолжайте в личке-я потом напишу тут, как сделаю и в чём причина.
Записан
Dannik
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 108


« Ответ #8 : 11.11.2016, 11:54:43 »

Ок. Спасибо огромное!
Записан
darkghost
Практически профи
*******

Репутация: +75/-0
Offline Offline

Сообщений: 1811



« Ответ #9 : 11.11.2016, 12:04:18 »

вариантов спойлера есть предостаточно - и хорошо, можно выбрать.
Самый простой - это использование -<summary>-
Показать текстовый блок
Вот по сложнее вариант
Показать текстовый блок
В данном варианте скорее всего идет перекрытие стилей, но могу ошибаться. Интересно было бы узнать причину, почему?
Записан
vipiusss
Профи
********

Репутация: +261/-8
Offline Offline

Пол: Мужской
Сообщений: 4573


Skype: renor_


« Ответ #10 : 11.11.2016, 12:08:43 »

Установил вам редактор JCE, у вас стоял Core, настроил, сделал по умолчанию, руссифицировал.
В материал вставил код со <style> = всё работает, проверяйте.

Теперь просто разнесите CSS в нужное место.

И обновитесь! у вас 3.4.8!

Из админки вышел, удачного дня.
Записан
Dannik
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 108


« Ответ #11 : 11.11.2016, 12:49:34 »

 Cheesy Спасибо огромное!! Все работает! Теперь везде буду ставить этот редактор!
Записан
Страниц: [1]   Вверх
  Добавить закладку  |  Печать  
 
Перейти в:  

Powered by SMF 1.1.21 | SMF © 2006, Simple Machines

Joomlaforum.ru is not affiliated with or endorsed by the Joomla! Project or Open Source Matters.
The Joomla! name and logo is used under a limited license granted by Open Source Matters
the trademark holder in the United States and other countries.

LiveInternet