CODEWITHSUNDEEP
jqueryreplacescrollbar
user725913
user725913

Reputation:

Issue replacing default scroll bar using jQuery plugin

I would like to replace the default scrollbar of my site (THIS page in particular) using a jQuery plugin called TinyScrollbar. However, for some reason I'm getting the following error on the page:

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

You can see this error by inspecting element in Chrome.

Might anyone have any ideas why this error is occurring? The code I am using to initialize the plugin can be seen below:

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

Upvotes: 6

Views: 12038

Answers (2)

user885100
user885100

Reputation:

The Tiny Scrollbar website doesn't mention that the JS library has class names hard coded in it. You could change this by extending the library to accept the class names of the individual, required html elements.

Upvotes: 0

dennisg
dennisg

Reputation: 4368

The problem is that you do not use the plugin as you're supposed to use it.

The error (in firefox firebug), using the source file of tinescrollbar, shows: oViewport.obj[0] is undefined. If you look a few lines up in the source code you can see that the property obj of oViewport is defined as : $('.viewport', root). In here root is your container. Apparently it doesn't find a html element with the class .viewport . Your page doesn't contain a html element with such a class!

If you look at tinyscrollbar's website you can see in the 'How to' section how to build up the proper HTML for the plugin to work.

Maybe an easier (similar plugin) you can use is jScrollPane. Does not require the HTML to be set up like tiniscrollbar's.

Upvotes: 19

Related Questions