ITメモ
HTML
外部Link
【HTML ドキュメント】MDN Web Docs（Mozilla）「HTML」リファレンス
HTMLメールの作り方「指定キーワード」を検索した「Google検索結果ページ」への「リンク」を作る方法「Google Map」へ「リンク」を作る方法「HTMLタグ」に「マウスアクション」を指定する方法「HTML」で「空白」を表示する方法「HTML」で「タブ（空白）」を表示する方法「HTML」の基礎知識
「HTML」の書式「HTML」でのコメントの仕方「HTML」での「改行」の仕方「CSS」の使い方「Javascript」の使い方「HTMLタグ」の使い方「HTML」の特殊文字一覧ブラウザやタブに表示される小さなアイコン「favicon（ファビコン）」の作り方他のページに移行する「リンク」の作り方 表の作り方Webページに「画像」の埋め込む方法Webページに「動画」を埋め込む方法Webページに「音声ファイル」を埋め込む方法地図を埋め込む方法入力フォームの作り方「HTML」タグ
【DOCTYPE】「HTML」の「DOCTYPE宣言」【html】すべての「HTMLタグ」の親要素「html」タグ【head】「Webページ」の付属情報を設定する場所【meta】「Webページ」の設定をする「HTMLタグ」【title】「Webページ」の「タイトル」を設定する「HTMLタグ」【link】外部ファイルとの関係定義や読み込みをする方法【script】「Javascript」を実行する方法【div】レイアウトの枠として使う方法【p】文章の段落ごとに区分する方法【li】リスト（箇条書き）で表示をする方法【table】表の作り方【br】「HTML」での「改行」の仕方【a】リンクの作り方【h1-h6】Webページの見出しの設定方法【img】画像を表示する方法【span】文字列の一部を装飾する方法【ruby】「ルビ」をふるための要素
【HTML】HTMLタグに「マウスアクション」を指定する方法
【HTML】
HTMLタグに「マウスアクション」を指定する方法
HTMLタグに「マウスアクション」を指定する方法
Webページで、「マウス」の操作内容に応じて、 処理を実行する際に、 「HTML」コードには、「マウスアクション」コードを埋め込む必要があります。
「HTML」では、利用できる「マウスアクション」が複数あります。
Web制作をするには必須のコードです。
INDEX
「マウスアクション」とは
「HTML」の「マウスアクション」は、
Webページ上で、「マウス」を操作したときの動作を検知するための「HTML」コードです。
Web上で、画像を「クリック」したことを検知したい場合は、
「画像」の「HTML」コード内に、「onclick="実行したいプログラムコードへのリンク"」要素を加え、 画像の「HTML」コードを記述することで、 「画像」を「クリック」したときに、アクションを実行させることができます。
主に、「javascript」などの「クライアントサイドプログラム」を実行するのに良く利用する方法です。
動的なWebページを制作するのには必須の「マウスアクション」なので、 操作方法は覚えておくと役立ちます。
Back
「HTML」タグで指定できる「マウスアクション」の種類
マウスの操作によって発生するイベントは「１０種類」。
| イベント名 | 発生タイミング |
|---|---|
| onclick | マウスのボタンを１度押して離した時（クリック） |
| ondbclic | マウスのボタンを押して離すを２度続けた時（ダブルクリック） |
| onmousedown | マウスのボタンが押された時 |
| onmouseenter | マウスカーソルが要素に入り込んだ時 |
| onmouseleave | マウスカーソルが要素から出た時 |
| onmousemove | マウスカーソルが要素の上を移動した時 |
| onmouseout | マウスカーソルが要素の上から離れた時 |
| onmouseover | マウスカーソルが要素の上に乗った時 |
| onmouseup | マウスのボタンが離された時 |
| onmousewheel | マウスのホイールを操作した時 |
Back
