Задать вопрос
yos
@yos
html

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

Вопрос собственно вот в чем. Есть потребность сделать спойлер который будет открываться после нажатия на кнопку. Кнопка оформлена с помощью css. не могу понять как сделать так, чтобы при нажатии на кнопку открывался спойлер, но кнопка не пропадала.
Вот код кнопки:
<a href="#" class="button" text-decoration: none;>Кнопка спойлера</a>

Вот так хочу чтобы было:
777.png
Возможно ли это?
  • Вопрос задан
  • 14662 просмотра
Комментировать
Подписаться 3 Оценить Комментировать
Помогут разобраться в теме Все курсы
  • Яндекс Практикум
    Профессиональная вёрстка на HTML и CSS
    3 месяца
    Далее
  • Stepik
    Основы HTML и CSS
    2 недели
    Далее
  • OTUS
    HTML/CSS
    3 месяца
    Далее
Решения вопроса 2
mlnkv
@mlnkv
JavaScript Developer
вот на чистом css
jsfiddle.net/NkYNL
Ответ написан
5 комментариев
5 комментариев
pushthebutton
@pushthebutton
Я бы использовал jQuery. Например:

<a href="#" class="button" style="text-decoration: none;">Кнопка спойлера</a>
<div class="spoiler" style="display:none; overflow-y:hidden; border:1px dashed #ccc; background:whitesmoke;">Текст спойлера</div>
$(function(){

$(".button").click(function(){
$(".spoiler").toggle();
});

});
Ответ написан
6 комментариев
6 комментариев
Пригласить эксперта
Ваш ответ на вопрос

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

Похожие вопросы
Вакансии с Хабр Карьеры
Верстальщик / фронтендер для браузерного расширения
DevTeam.Space
от 1 000 до 2 000 $
Специалист технической поддержки (чат)
WebSoft
от 50 000 до 70 000 ₽
Web-разработчик
ЭНДИ Консалтинг
от 40 000 до 40 000 ₽
Ещё вакансии