メモ：prototypeを使ってブロック要素を開閉

prototype.jsのメモ。
あるブロック要素を、ボタンを押したタイミングで閉じたり開いたりする時。
HTML要素がある事をあてにした書き方だとIEでのみエラーがでた。

これだとエラー。.innerHTMLで中身はいってる？とかにしても駄目。

Event.observe(window, "load", function(){
	var element = $("panel");
	if (element.length>0) {
		Event.observe("btn_open", "click", function(){
			$("panel").show();
			$("btn_open").hide();
			$("btn_close").show();
		}, false);
		Event.observe("btn_close", "click", function(){
			$("panel").hide();
			$("btn_open").show();
			$("btn_close").hide();
		}, false);
		$("panel").hide();
		$("btn_close").hide();
	}
}, false);

panel

開閉されるブロック要素。id="panel"が振られている。

btn_open

開くボタン。id="btn_open"が振られている。

btn_close

閉じるボタン。id="btn_close"が振られている。

※開くボタンと閉じるボタンも見栄えが変わる様表示切り替え、という設定

これで上手くいった。jQueryのセレクタでなれてるのでこっち使おうと思う。というメモ。

Event.observe(window, "load", function(){
	var element = $$("#panel");
	if (element.length>0) {
		Event.observe("btn_open", "click", function(){
			$("panel").show();
			$("btn_open").hide();
			$("btn_close").show();
		}, false);
		Event.observe("btn_close", "click", function(){
			$("panel").hide();
			$("btn_open").show();
			$("btn_close").hide();
		}, false);
		$("panel").hide();
		$("btn_close").hide();
	}
}, false);