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:
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?
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?
