Moloco Moloco - 10 months ago 42
CSS Question

How can i apply a css modification with a button

I would like to apply a filter to an image (when im clicking a button)
and if i click another button it applyes another filter.

How can i do that?

Thanks for your help.

I've tryed using the :active function on css but that just applyes to the button
I've tryed using javascript but it didn't work

function FilterGrey() {
var FilterGrey = Document.getElementsById("FilterGrey"); = "grayscale(100%)"

Answer Source

Here is an example done by toggling classes with JavaScript.


<img src="" id="image">
<button onclick="filter1();">Filter 1</button>
<button onclick=“filter2();">Filter 2</button>


.filter1 {
  filter: blur(10px);
.filter2 {
  filter: grayscale(50%);


function filter1() {
function filter2() {