fc2ブログ

記事一覧

マウスによるイベント:mouseoverとmouseout

HTML上でマウスを操作するという事は、HTML上にある様々な要素をマウスを介して作用させるともいえます。
そのときにもマウスの操作に応じてイベントを設定することができます。

mouseoverとmouseout

マウスを動かしてHTML上の要素にマウスポインタ―を乗せることもイベントとして扱えます。
そのイベントはJavaScriptでmouseoverイベントとして設定できます。
また要素からマウスポインタ―が離れることもイベントとして扱えて、これはmouseoutイベントして設定できます。
このmouseoverイベントとmouseoutイベントはそれぞれイベントハンドラのonmouseover属性、onmouseout属性で指定されるイベントです。
イベントハンドラに指定されるイベントをイベントトリガーといいます。



このスクリプトではHTMLのbox要素にマウスポインタ―を乗せると文章が表示されます。

HTML上の要素をイベントに組み込むにはそのHTMLの要素を取得する必要がありますので、まずHTMLのbox要素を取得してイベントハンドラを設定しています。

このスクリプトはイベントをaddEventListenerメソッドを用いてイベントの処理を指定しています。
addEventListenerメソッドを用いた記述では第1引数に参照するイベントトリガーを記述します。
スポンサーサイト



コメント

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

コメントの投稿

非公開コメント

プロフィール

memomemoprobe1

Author:memomemoprobe1
FC2ブログへようこそ!

カウンター