Fw

Wordpress Creative Developer

Tutorial jQuery – Scrollbar Personalizzate

  • Tutorial Jquery
  • -

Continuano i tutorial jQuery, dove si analizza come migliorare ogni elemento del nostro sito per dare una user experience unica all’utente.

Oggi in particolare voglio segnalarti questa risorsa jQuery per ottenere delle scrollbar personalizzate.

Tutorial jQuery - Scrollbar personalizzata

Come puoi vedere nell’esempio, è possibile fare lo scrolling anche con la rotellina del mouse oltre a utilizzare la barra di scorrimento e inoltre c’è un piacevole effetto di easing durante lo scrolling.

Non mi voglio dilungare nella spiegazione su come ottenere questo effetto, dato che è tutto ampiamente spiegato nel tutorial.

Inoltre ho testato l’esempio  con diversi browser e funziona anche con Internet Explorer 6 (anche se ormai non lo considero più).

Per qualunque dubbio su come utilizzare le scrollbar chiedi pure nei commenti! 😉

10 Commenti

  1. Ottima segnalazione, grazie!
    Io ho sempre utilizzato jScrollPane per ottenere delle scrollbar personalizzate, ma proverò sicuramente anche questo.

  2. Ottimo articolo Fede 😉

  3. […] This post was mentioned on Twitter by Ciro Marandola, fedeweb. fedeweb said: Tutorial jQuery – Scrollbar Personalizzate: Continuano i tutorial jQuery, dove si analizza come migliorare ogni … http://bit.ly/hBnw0Z […]

  4. Benissimo… lo cercavo proprio oggi!
    Appena utilizzato e funziona alla perfezione!

    grazie mille!

  5. Ciao Fede, grazie per questa segnalazione ! Sto provando ad utilizzare queste scrollbar sul mio sito, tuttavia, se come contenuto del DIV scrollabile inserisco un altro DIV con la proprietà float left, il primo DIV non svolge più il “proprio dovere” ! Fede, mi puoi aiutare ? Non so se sono stato chiaro …

  6. Forse con un esempio è più chiaro : http://www.alizee-italia.com/fedeweb/discografia/une-enfant-du-siecle.html !

    Questo problema avviene soltanto se inserisco un DIV con float left !

  7. Ciao Alessandro e benvenuto nel blog 😉

    Scusa per il ritardo nella risposta; ho visto l’esempio e mi sembra che hai risolto o sbaglio?

  8. Ciao Fede, grazie del benvenuto e della risposta ! No, non ho ancora risolto 🙁 il problema sta nel fatto che quando scrollo il contenuto si origina uno spazio vuoto in alto che in realtà non esiste… è difficile da spiegare !

  9. non funziona con IPAD :-((( …qualcuno ha la soluzione?

  10. Quando inserisco la pagina con lo scroll in un div vuoto non mi funziona più.

Scrivi un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *