2012-04-16 9 views
6

Vorrei sostituire la barra di scorrimento predefinita del mio sito (THIS in particolare) utilizzando un plug-in jQuery chiamato TinyScrollbar. Tuttavia, per qualche motivo sto ottenendo il seguente errore nella pagina:Problema sostituzione barra di scorrimento predefinita utilizzando il plugin jQuery

jquery.tinyscrollbar.min.js:1Uncaught TypeError: Cannot read property 'offsetHeight' of undefined 

Si può vedere questo errore elemento ispezionando in Chrome.

Qualcuno ha qualche idea del perché si sta verificando questo errore? Il codice che sto usando per inizializzare il plugin può essere visto sotto:

$('#full-height-template-container').tinyscrollbar(); 
+1

il problema forse nel tuo 'fadeIn', prova a usare fadin 'callback' func per poi aggiungere tinyscroll all'elemento, poiché l'elemento non ha offset finché non è': visible' – SpYk3HH

+0

Come farei? Ho pensato che stavo chiamando tinyScroll dopo fadeIn non ci sarebbe alcun problema lì. Dovrei semplicemente fare .fadeIn (function() {tiny scroll here}); –

+0

Document.ready non viene eseguito dopo il caricamento del DOM? –

risposta

19

Il problema è che non si utilizza il plugin come si suppone di usarlo.

L'errore (in firefox firebug), utilizzando il file di origine di tinescrollbar, mostra: oViewport.obj[0] è undefined. Se si osservano alcune righe nel codice sorgente, si può vedere che la proprietà obj di oViewport è definita come: $('.viewport', root). Qui la radice è il tuo contenitore. Apparentemente non trova un elemento html con la classe .viewport. La tua pagina non contiene un elemento html con una classe simile!

Se si osserva il numero website di tinyscrollbar, è possibile vedere nella sezione "Come fare" come creare l'HTML corretto affinché il plug-in funzioni.

Forse un più semplice (plug-in simile) che è possibile utilizzare è jScrollPane. Non richiede che l'HTML sia impostato come tiniscrollbar.

+0

La parte migliore di jScrollPane è che funziona anche sui browser mobili, anche se non è perfetto, è migliore della maggior parte dei plugin che ho provato. –

0

Il sito Web Tiny Scrollbar non menziona il fatto che la libreria JS abbia dei nomi di classe codificati in esso. Puoi cambiarlo estendendo la libreria per accettare i nomi di classe dei singoli elementi html richiesti.

Problemi correlati