Задать вопрос

Как сделать спойлер только на CSS3?

Привет!

Скиньте, пожалуйста, HTML/CSS кодов спойлеров, сделанных только на CSS.
Можно самостоятельно сделанных, можно ссылками с других сайтов (русско- и англоязычных).

Я, конечно, сам находил в интернете спойлеры, но те варианты, которые находил, мне не очень нравились.

Очень важные параметры:

1) Чтобы можно было задавать отдельные имена заголовку спойлера (развернуть/свернуть и т.д.) в html коде. Как здесь: usefulscript.ru/spoiler_css.php#m743 - открыть/закрыть, но здесь только "закрыть" задано в html коде, а "открыть" уже прописано в css - что усложняет настройку внешнего вида спойлера.
2) Плавная работа на мобильных устройствах (имеется ввиду то, что у них слабый процессор и анимация может дергаться - хотя, наверное, CSS по умолчанию слабо будет нагружать процессор).
3) Ну и естественно минимум кода (отсутствие лишнего кода).

О поддержке старых браузеров НЕ беспокоюсь.

А вообще, мне вот здесь спойлеры нравятся (по внешнему виду): cbr.ru - правда не знаю, как они реализованы.

По-моему, хороший вариант решения получился:
jsfiddle.net/x8FQJ/1/
Спойлер плавно выдвигается вниз.
  • Вопрос задан
  • 15742 просмотра
Подписаться 4 Оценить 1 комментарий
Помогут разобраться в теме Все курсы
  • Нетология
    Веб-разработчик с нуля: профессия с выбором специализации
    14 месяцев
    Далее
  • Академия Эдюсон
    Frontend-разработчик: тариф PRO
    10 месяцев
    Далее
  • ProductStar × РБК
    Профессия: Инженер по тестированию + ИИ
    6 месяцев
    Далее
Решения вопроса 1
Пригласить эксперта
Ответы на вопрос 1
Fiasco
@Fiasco
чистый css
jsfiddle.net/K3Msa
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы