javascriptが動かなくて困ったとき
ホームページで、いろいろな動きをさせるためにいくつものjavascriptを使うということはよくあることだと思います。
しかしながら設置方法は間違っていないのになぜか動かない・・・
というのを何回か体験。
動かないのはjqueryで動くタブメニュー。
設置した当初は動いていて、タブをクリックすればそのタブのコンテンツが表示される・・・という正常な動きを見せていたのに。今日になったら動いていないことに気が付いきました。
ノンプログラマの私は、ソースを見てもイマイチよくわからず。
うーんうーんと唸って1時間ぐらいたったころ・・・そういえば、少し前、このサイトはヘッダーを固定してるのでページ内アンカーにリンクを貼ると、リンク位置が固定したヘッダに隠れてずれてしまう。という問題を抱えていました。
cssでの調整だけではうまく行かず、jqueryのソースをコピペしたことを思い出す。。それがそのまま放置されていたのです。
もしかしたらこれかも。
その部分のソース一式を切り取って、再度確認したら、
動いた～！！
詳しくは理解できてないのですがそのソースは全てのアンカーの位置をずらしてしまっていたようでそれがタブのリンクにも及んでいたみたいです。
似たようなことがもう一つ。
lightbox系の有名なプラグインcolorboxを設置して時のこと。
ここでも何故か動かない。
設置方法は何度見なおしても間違いはない。。。
スペルミスも、リンク切れもない。。。
この時もどうやら他のソースを先に読み込んでいて動かなかった。
記述順を変えたら無事設置できました。
javascript同士でバッティングしてしまうことはよくある？のでしょうか。
これからはスクリプト同士が干渉しあってないか十分確認です。
あとjqueryのバージョンが古すぎたり新しすぎたりで動かないこともあるようです。
うまく設置できない時はこの辺のことに注意（javascriptも勉強しなきゃ）