CODEWITHSUNDEEP
javascripthtmlcss
Muhammad Ali
Muhammad Ali

Reputation: 198

Activating CSS through a HTML button press

I was wondering if you can activate some CSS through an HTML button press or scrolling to a certain point. It's preferred if it's through JS.

Upvotes: 1

Views: 775

Answers (2)

Tidus101
Tidus101

Reputation: 11

As previously said by @Lain, it is indeed possible. something like someElement.classList.add() or someElement.classlist.toggle() MDN Web API

Upvotes: 0

Lars Flieger
Lars Flieger

Reputation: 2564

You can use a wrapper class:

const button = document.querySelector("button")
button.addEventListener("click", () => {
  document.body.classList.add("red")
})
.red {
  color: red;
}
<h1>Stackoverflow is nice!</h1>
<p>Great website!</p>
<button>Change CSS</button>

  • Create a button which listens for a user action.
  • When the button is clicked add a class to the body element.
  • Use this class to apply different css rules.

You can build a dark theme with that for example.

Upvotes: 1

Related Questions