Filter

Why won't this work? Only the opacity has been changed. Do I need to create separate lines for each aspect of the filter I want to change? Can I not change more than one aspect of the filter on an element? document.querySelector(".main-container").style.filter = "opacity(0.3)", "saturate(100%)", "hue-rotate(0deg)", "brightness(100%)", "contrast(100%)", "blur(5px)";
3 Replies
Electronic
Electronic2y ago
I think it's the comma
MarkBoots
MarkBoots2y ago
you can just make it 1 big string
document.querySelector(".main-container").style.filter = "opacity(0.3) saturate(100%) hue-rotate(0deg) brightness(100%) contrast(100%) blur(5px)";
document.querySelector(".main-container").style.filter = "opacity(0.3) saturate(100%) hue-rotate(0deg) brightness(100%) contrast(100%) blur(5px)";
but if you want to make it more clear. just add a class that contains this filter in css.
.custom-filter {
filter: opacity(0.3) saturate(100%) hue-rotate(0deg) brightness(100%) contrast(100%) blur(5px)
}
.custom-filter {
filter: opacity(0.3) saturate(100%) hue-rotate(0deg) brightness(100%) contrast(100%) blur(5px)
}
document.querySelector(".main-container").classList.add("custom-filter")
document.querySelector(".main-container").classList.add("custom-filter")
Spiritual Tech
Thanks! That worked, thanks!
Want results from more Discord servers?
Add your server