TinyScrollbarという jQuery プラグインを使用して、自分のサイト (特にこのページ) のデフォルトのスクロールバーを置き換えたいと考えています。ただし、何らかの理由で、ページに次のエラーが表示されます。
jquery.tinyscrollbar.min.js:1Uncaught TypeError: Cannot read property 'offsetHeight' of undefined
このエラーは、Chrome で要素を調べることで確認できます。
このエラーが発生している理由を誰かが知っているでしょうか? プラグインを初期化するために使用しているコードを以下に示します。
$('#full-height-template-container').tinyscrollbar();
問題は、プラグインを本来の用途で使用していないことです。
tinescrollbar のソース ファイルを使用したエラー (firefox firebug) には、次のように表示oViewport.obj[0]されますundefined。ソース コードの数行を調べると、oViewport のプロパティ obj が : として定義されていることがわかります$('.viewport', root)。ここでルートはコンテナです。クラス .viewport を持つ html 要素が見つからないようです。あなたのページには、そのようなクラスを持つ html 要素が含まれていません!
tinyscrollbar のWeb サイトを見ると、「方法」セクションで、プラグインが機能する適切な HTML を構築する方法を確認できます。
おそらく、使用できるより簡単な (同様のプラグイン) はjScrollPaneです。Tiniscrollbar のように HTML を設定する必要はありません。
Tiny Scrollbar の Web サイトには、JS ライブラリにクラス名がハードコードされていることは記載されていません。ライブラリを拡張して、個々の必要な html 要素のクラス名を受け入れることで、これを変更できます。