Cambiare classi solo scroll up

lazlo

Utente Attivo
24 Gen 2018
20
0
1
Salve ragazzi, tempo fa ho sviluppato un sito in cui mi si chiedeva di modificare la barra del menù scrollando con il mouse o con la barra laterale del browser.
Per farlo, usai un codice jQuery che ho trovato in rete:
Codice:
jQuery(window).scroll(function() {   
    var scroll = jQuery(window).scrollTop();
     //console.log(scroll);
    if (scroll >= 50) {
        //console.log('a');
        jQuery("#id-elemento").addClass("classe-da-aggiungere");
    } else {
        //console.log('a');
        jQuery("#id-elemento").removeClass("classe-da-rimuovere");
    }
});

In pratica, come potete vedere, con questo script jQuery, scrollando di 50px e oltre, all'elemento che ha un determinato id viene aggiunta una classe; viceversa, tornando indietro con lo scroll sotto i 50px dal top della pagina, quella classe aggiunta precedentemente viene tolta.

Il codice funziona bene, però ora sto sviluppando un altro sito dove quello che vorrei fare è leggermente diverso:
in pratica, senza dilungarmi con le spiegazioni, ora l'elemento che ha un certo id ha già anche una classe assegnata, e quello che vorrei fare io è che quando si scrolla verso il basso, quindi si scende con la pagina, non deve succedere nulla. Quando si scrolla verso l'alto, invece, arrivati al top della pagina, deve essere rimossa la classe che l'elemento già ha.

Non so se sono riuscito a spiegarmi bene.
Ora, si può in qualche modo adattare lo script postato sopra, oppure esiste uno script che mi permetta di eseguire l'azione soltanto allo scroll up?
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Ciao, se non ho capito male ti basta controllare quando lo scroll arriva a 0
Codice:
jQuery(window).scroll(function () {
                var scroll = jQuery(window).scrollTop();
                if (scroll == 0) {
                    jQuery("#id-elemento").removeClass("classe-da-rimuovere");
                }
            });
 

lazlo

Utente Attivo
24 Gen 2018
20
0
1
Hai capito benissimo. È proprio quello che cercavo, funziona benissimo.
Grazie mille.
 
Discussioni simili
Autore Titolo Forum Risposte Data
D Aiuto CSS in ELEMENTOR - Cambiare un testo CMS (Content Management System) 0
M Cambiare pennello a lavoro completo Photoshop 0
Y cambiare sfondo di una pagina Javascript 1
E Cambiare lingua in Elements per Mac Mac e Software 2
R Non riesco a cambiare l'immagine di sfondo PHP 4
K Cambiare font size su echo stringa variabile PHP 24
V [PHP Symphony] Cambiare da ApcCache ad OpCache PHP 4
Web93 CAMBIARE TAG POST TITOLO DA H2 A H1 WordPress 1
L [PHP] cambiare gli if in un url semplice PHP 1
G Cambiare colore ad un record database mysql MySQL 0
Domenico_Falco1 Cambiare url in un sito con pagine dinamiche Ajax 4
Topografo Buon 2019 (Tutti gli altri hanno scritto "Salve a tutti", cerchiamo di cambiare) Presentati al Forum 1
joomeph Cambiare Nome Utente Supporto Mr.Webmaster 3
M [Visual Basic] Cambiare lo stato in checked delle checkbox richiamando dati dal database Visual Basic 6
Koboshi Cambiare il css di una pagina con tasto "on off" HTML e CSS 5
Licantropo [MySQL] Cambiare le date MySQL 4
B [Javascript] Cambiare classe ed aggiornare relativi eventi Javascript 3
L Cambiare nome pagina facebook Annunci servizi di Social Media Marketing 4
P [HTML] Wordpress - cambiare font di un tema WordPress 1
L APPARECCHIO VOIP DA CAMBIARE Adsl e Connettività 0
T cambiare formato in uscita timestamp Database 0
O Allo scroll cambiare colore di sfondo jQuery 0
crealatualista [Javascript] Cambiare record tabella... Javascript 4
napuleone [Javascript] cambiare i parametri di stampa con js Javascript 2
DaveCricket [WordPress] [PHP] Cambiare il colore del link di una pagina attiva WordPress 3
V javascript - cambiare immagine di sfondo di un div Javascript 3
D [Javascript] Script che consenta di cambiare un'immagine in base all'ora del giorno della settimana Javascript 11
B CAMBIARE PAGINA INIZIALE PHPMYADMIN MySQL 2
webmachine [WORDPRESS] Cambiare titolo pagina articoli WordPress 0
webmachine [WOOCOMMERCE][WORDPRESS] Cambiare testo pulsante Acquista E-Commerce 0
webmachine [PRESTASHOP] Cambiare ordine prezzo-sconto-prezzoscontato E-Commerce 1
B CAMBIARE TEMPLATES PHPMYADMIN MySQL 0
otto9due Dreamweaver CC 2017 - cambiare colorazione codice Windows e Software 5
webmachine [JQUERY] Cambiare immagine al click, toggle jQuery 1
A Cambiare Risposta onclick con Switch. Javascript 1
V Cambiare colore ad un button HTML e CSS 3
E Cambiare l'option di un select con jquery jQuery 1
ecosito CSS: è possibile cambiare font con uno non di uso comune? HTML e CSS 11
Jonn [Javascript] Cambiare colore sfondo div allo scroll del mouse Javascript 3
Shyson Cambiare color all'onclick Javascript 9
elettroweb come cambiare testo Flash 0
M Cambiare dinamicamente il contenuto di un DIV Javascript 4
M Cambiare valore ad un campo in base alla selezione fatta nel menu a tendina PHP 16
R Cambiare la variabile in modo permanente PHP 3
P Cambiare il valore di un campo tabella con un pulsante cliccabile PHP 2
B cambiare sfondo alle celle della tabella Javascript 1
Lucia Fiore cambiare variabili <a in <a href='indirizzo'> HTML e CSS 1
A Cambiare il font-size della sidebar WordPress 2
B Javascript: Cambiare valore Css Javascript 1
R Cambiare directory Wordpress WordPress 4

Discussioni simili