javascript Archive

制作の過程でprototype.jsやjQuery、mootoolsといったJavaScriptライブラリを利用する機会も増えてきました。しかし、調子に乗ってライブラリを複数使うと、なぜかうまく動かなくなった・・・スクリプトにはエラーはないはずなのに・・・ということが出てきます。
というのも、スクリプトを呼び出す際に利用する「$」記号が競合してしまう模様です。私も今回まんまとそれに引っかかった次第です。
調べてみたところ、prototype.jsあるいはmootoolsをjQueryと共有する場合、headタグの中で外部JavaScriptの読み込みを指定するときにjQuery→prototype.jsあるいはmootoolsという順番で記述し、jQueryの読み出しタグ<script type=”text/javascript” src=”js/jquery.js”>
</script>と二つ目のライブラリの読み出しタグ<script type=”text/javascript” src=”js/prototype.js”></script>の間に

という命令を入れ、jQueryで書いたスクリプト本体に登場する「$」記号を「jQuery」に置き換えると、２つのライブラリが競合するのを防ぐことができるようです。

本日のエントリーは以下の記事を参考にさせていただきました。

• jquery.jsとprototype.jsの念願の共存
  http://blog.chibatch.jp/articles/jqueryprototype.html
• mootoolsとjQueryを一緒に使う方法
  http://blog.chibatch.jp/articles/mootoolsjquery.html

Lightboxと似たようなエフェクトで動画やFlashの再生に使えるJavaScript、Mediaboxを使ってみることに。

動作サンプルのサイト

導入にあたり、公式サイトの手順に従い試してみるのですが、this.keyboardListener.bindAsEventListener is not a function・・とか、なんたらかんたらエラーが出てうまくいきませんでした。
エラー文でググってみたところ、どうやらMediaboxは、その利用に必要なJavaScriptライブラリのMooToolsの最新版であるVer.1.2には非対応であり、そのために出たエラーのようです（Mediabox開発元サイトでは、次のメジャーなバージョンアップ（Ver.0.7.4か？）の際には対応予定と書いてあります）。
しかし、現行MooToolsのサイトにはVer.1.2しか見当たりません・・・。ということは、今のところ、Mediaboxを利用しているサイトを探し、そのソースからmootools(Ver.1.11)のファイルのアドレスを抜き出して中身をコピーする・・・という、オープンソースとはいえ少し罪悪感の残るやり方をするしかなさそうですね（＾＾；）

mootoolsは他にもこんな使い方ができるそうです。もっと使いこなしてみたいですね。
mootools 93 Plugins：skuare.net