Задать вопрос
Tolly
@Tolly
css

Можно ли подружить checkbox + button?

Можно ли сделать, чтобы с помощью чекбокса менять кнопки местами?
К примеру, заменить кнопку "play" на "pause", зависимости от состояния чекбокса.

Стили CSS писать не обязательно. Нужно подсказать, почему не чекается при клике на кнопку, и можно ли это победить.

PS. Как сделать с JS знаю.

Пример на codepen.io
  • Вопрос задан
  • 1324 просмотра
Комментировать
Подписаться 1 Простой Комментировать
Решения вопроса 1
AleksandrB
@AleksandrB
Совсем недавно вывел "Hello world"
Использовать onchange, проверять:
Если checked возвращает true, прописывать движение через style
Если false прописывать другое движение
Кнопкам не забудь transition задать что бы плавно перемещались
Ответ написан
5 комментариев
5 комментариев
Пригласить эксперта
Ответы на вопрос 3
tema_sun
@tema_sun
Если возможно отказаться от тега button, то возможен такой вариант:
https://codepen.io/anon/pen/oJgRza

С button это по идее работать не будет, т.к.
Разрешенный контент
Текстовый контент, но без вложенных элементов label. Недопустимы другие оборачиваемые в label элементы помимо целевого.

https://developer.mozilla.org/ru/docs/Web/HTML/Ele...
Ответ написан
Комментировать
Комментировать
@jasper-blondin
Вариант решения на чистом CSS:
https://codepen.io/anon/pen/NePEZO
Ответ написан
4 комментария
4 комментария
@nvdfxx
Senior Pomidor developer
codepen
Ответ написан
4 комментария
4 комментария
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
JavaScript разработчик
вАйТи
от 5 000 до 25 000 ₽
Frontend React
Glob-com
от 100 000 ₽
Trainee - IT Support
move2usajobs.com LLC • Лос-Анджелес
от 2 000 до 4 000 $
Ещё вакансии
Заказы с Хабр Фриланса
Ошибка в 1с при выгрузке товаров на сайт на Битриксе
25 апр. 2024, в 03:08
3000 руб./за проект
Создание и публикация короткого (reels) UGC-видео на YouTube-канале
25 апр. 2024, в 01:46
500 руб./за проект
Настроить перехват https-трафика для android-приложения
25 апр. 2024, в 01:02
10000 руб./за проект
Ещё заказы