ITメモ
HTML
外部Link
【HTML ドキュメント】MDN Web Docs(Mozilla)
「HTML」リファレンス
HTMLメールの作り方「指定キーワード」を検索した「Google検索結果ページ」への「リンク」を作る方法「Google Map」へ「リンク」を作る方法「HTMLタグ」に「マウスアクション」を指定する方法「HTML」で「空白」を表示する方法「HTML」で「タブ(空白)」を表示する方法【XML】サイトマップ作り方
「HTML」の基礎知識
「HTML」の書式「HTML」でのコメントの仕方「HTML」での「改行」の仕方「CSS」の使い方「Javascript」の使い方「HTMLタグ」の使い方「HTML」の特殊文字一覧ブラウザやタブに表示される小さなアイコン「favicon(ファビコン)」の作り方他のページに移行する「リンク」の作り方 表の作り方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】「ルビ」をふるための要素
SEO(Search Engine Optimization)
「SEO対策」の具体的な方法「検索エンジン」に登録する方法「SEO対策」に有効な「ページタイトル」の記述方法「SEO対策」に有効な「キーワード」の記述方法「SEO対策」に有効な「ディスクリプション」の記述方法





【HTML】HTMLタグに「マウスアクション」を指定する方法

【HTML】
HTMLタグに「マウスアクション」を指定する方法




Webページで、「マウス」の操作内容に応じて、 処理を実行する際に、 「HTML」コードには、「マウスアクション」コードを埋め込む必要があります。


「HTML」では、利用できる「マウスアクション」が複数あります。
Web制作をするには必須のコードです。



「マウスアクション」とは


「HTML」の「マウスアクション」は、
Webページ上で、「マウス」を操作したときの動作を検知するための「HTML」コードです。


Web上で、画像を「クリック」したことを検知したい場合は、
「画像」の「HTML」コード内に、「onclick="実行したいプログラムコードへのリンク"」要素を加え、 画像の「HTML」コードを記述することで、 「画像」を「クリック」したときに、アクションを実行させることができます。


主に、「javascript」などの「クライアントサイドプログラム」を実行するのに良く利用する方法です。
動的なWebページを制作するのには必須の「マウスアクション」なので、 操作方法は覚えておくと役立ちます。


Back

「HTML」タグで指定できる「マウスアクション」の種類


マウスの操作によって発生するイベントは「10種類」。


イベント名発生タイミング
onclickマウスのボタンを1度押して離した時(クリック)
ondbclicマウスのボタンを押して離すを2度続けた時(ダブルクリック)
onmousedownマウスのボタンが押された時
onmouseenterマウスカーソルが要素に入り込んだ時
onmouseleaveマウスカーソルが要素から出た時
onmousemoveマウスカーソルが要素の上を移動した時
onmouseoutマウスカーソルが要素の上から離れた時
onmouseoverマウスカーソルが要素の上に乗った時
onmouseupマウスのボタンが離された時
onmousewheelマウスのホイールを操作した時


Back