jQueryプラグインを拾ってきて、
ポップアップや写真のギャラリーなど簡単に作れますし、
見た目もきれいに仕上がりますので、とても便利です。
いろんなところでプラグインのサンプルを拾って来ては、
テストして動きを確かめるのは面白い作業ですが、
プラグインを導入しても、いきなり動かないときが多々あります。
そんなときにチェックしたい項目をまとめました。
目次
1.jQueryのバージョンと読み込みアドレスが合っているかチェック
まずは基本です。この時点で間違っていることがよくあります。(反省)
2.不足しているjQueryプラグインがないかチェック
よくサンプルコードをみると、別のjQueryプラグインが必要な場合もあります。
3.「$」の扱いをチェック
jQueryとprototypeを同時に導入していたりすると起こることが多いです。
$の扱いがjQueryとprototypeでは違うために起こる現象です。
「$」→「jQuery」と書き換えると、あっさり動くことが多いです。
このように書くところを、
$('#rss').append(Feed);このように書き換えます。
jQuery('#rss').append(Feed);また、その部分がjQueryで動いていることを示せば良いので、
jQuery(document).ready(function($){
$('#rss').append(Feed);
});
4.jQueryを動かす順番をチェック
これも非常に多いパターンです。複数のjQueryを同時に動かしたいとき、
例えば、jQueryでDOMツリーを生成して、その生成したdivタグなどを、
別のjQueryでツールチップ化したい場合などです。
この時、先にDOMツリーを生成してから、ツールチップ化するという順番で動かす必要があります。
先にツールチップ化する方を動かしてしまうと、
ツールチップ化する対象となるDOMツリーが見つからずに結果的に動かないという現象になります。
5.対象となるdivタグのidが被っていないかチェック
これも複数のjQueryを動かしたいときに、サンプルそのままのid指定だと、
複数のサンプル間でidが被っている場合がありますので、チェックが必要です。
ここまでチェックして、おかしなところがなかったら、
本格的にjQueryプラグインの中身を見るしか……(・´з`・)