Witam, mam problem: otóż chciałbym aby po kliknięciu obrazka strona zmieniała swoją kolorystykę na negatyw. W CSSie robiłem to filter:invert(100%) i instrukcja była wykonywana podczas wczytywania strony, teraz chciałbym, aby kolory można było zmieniać "w locie". Z JavaScript prawie nie miałem do czynienia, nie wiem nawet czy powinienem to wykonywać w skrypcie czy nie.
0
0
Utwórz klasę CSS np. inverted
, która będzie miała ten filter:invert(100%);
, a potem w JS tę klasę ustawiaj/usuwaj.
0
W jaki sposób można w JS wywołać klasę CSS?
1
z użyciem biblioteki jQuery:
$('SELEKTOR ELEMENTU').click(function (e) {
$(e.target).toggleClass('NAZWA KLASY');
});
https://jsfiddle.net/v2hbgr0v/
albo bez użycia jQuery:
document.querySelectorAll('SELEKTOR ELEMENTU').forEach(function (el) {
el.addEventListener('click', function (e) {
e.target.classList.toggle('NAZWA KLASY');
});
});
https://jsfiddle.net/v2hbgr0v/1/
zakładając, że obrazków może być więcej niż 1. Jeśli jeden to można użyć zwykłego document.getElementById
zamiast querySelectorAll
i forEach