Ajax prototype.js エレメントの表示・非表示を切り替える

-

Topページ　 >　 お勉強　 >　 Ajax　 >　 エレメントの表示・非表示を切り替える　

エレメントの表示・非表示を切り替える

▲

エレメントの表示・非表示を切り替えます。



prototype.js


使用バージョン：1.5.1　公式サイト




▲

1. ダウンロードしたprototype.jsを読み込みます。

<script type="text/javascript"
    src="prototype.js"></script>

2. Element.toggleメソッドを実行します。

[HTML]
<div id="targetBox"></div>
  :
  :
[JavaScript]
Element.toggle("targetBox");


▲

Element.toggle( element )


element 表示切り替え対象エレメントのID。


ファイル一式をダウンロードする
▲

↓インラインフレーム内でサンプルが動作しています。



▲

[Ajax - prototype.js - エレメント]

IDからタグ要素の参照を取得する 　【$】


エレメントを削除する 　【Element.remove】


エレメントのX座標、Y座標を取得する 　【Position.page】

Topページ　 >　 お勉強　 >　 Ajax　 >　 エレメントの表示・非表示を切り替える　




-