Как сделать переключение настроек через JS?

Question

[Дмитрий]

Просьба подсказать (с примером), как можно сделать смену кода в CSS через кнопку или переключатель на JS? Надо добавить на страницу кнопку/переключатель, при нажатии на которую у класса менялось свойство oveflow: hidden на oveflow-x: scroll.

Answer 1

[Rsa97]

Можно и без JS

Comments

[Дмитрий]

Спасибо за ответ и пример! Попробую так сделать.

[Дмитрий]

Подскажите ещё, пожалуйста, как правильно применить этот переключатель? Сделал из одного примера, но текст не раскрывается при нажатии.

[Rsa97]

Дмитрий, Переделывать. CSS работает только вперёд и вглубь. Соответственно, изнутри label сослаться на div невозможно.
Можно так:

[Дмитрий]

Rsa97, большое спасибо за быстрый ответ и пример! Сколько премудростей в CSS, оказывается :-)

[Дмитрий]

Rsa97, подскажите ещё, пожалуйста, как ещё сделать, чтобы и в следующем div тоже менялось правило? И где можно об этом почитать?

[Rsa97]

Дмитрий,
https://developer.mozilla.org/ru/docs/Web/CSS/CSS_...

[Дмитрий]

Rsa97, спасибо за ссылку, почитал и вроде получилось то, что хотел сделать.

Answer 2

[ForSureN1]

Создаешь 2 класса в Css файле, у одного overflow:hidden, у второго oveflow-x: scroll.
создаешь переменную button к ней цепляешь свой класс переключателя document.querySelector('.123')
создаешь вторую переменную, куда тебе нужно будет запихивать твой overflow
далее подвешиваем на нашу переменную событие
button.addEventListener('click', () => {
переменная2 = document.addClass.toggle('название класса с oveflow: hidden ')
} )

Comments

[ForSureN1]

Дальше сам :)