ゆきのふ

ドロップダウンメニュー

閉じるボタンで閉じられるドロップダウンメニューの作り方【HTML/CSS/JavaScript・サンプルコード付き】

閉じるボタンで閉じられるドロップダウンメニューの作り方 閉じるボタンで閉じられるドロップダウンメニューを作る方法を紹介します。このサンプルでは、ボタンをクリックするとドロップダウンメニューが表示され、メニュー内に配置した閉じるボタンを押すこ...
ドロップダウンメニュー

指定時間後に自動で閉じるドロップダウンメニューの作り方【HTML/CSS/JavaScript・サンプルコード付き】

指定時間後に自動で閉じるドロップダウンメニューの作り方 指定時間後に自動で閉じるドロップダウンメニューを作る方法を紹介します。このサンプルでは、ボタンをクリックするとドロップダウンメニューが表示され、一定時間が経過すると自動的に閉じる動作を...
ポップオーバー

指定時間後に自動で閉じるポップオーバーの作り方【HTML/CSS/JavaScript・サンプルコード付き】

指定時間後に自動で閉じるポップオーバーの作り方 指定時間後に自動で閉じるポップオーバーを作る方法を紹介します。このサンプルでは、ボタンをクリックするとポップオーバーが表示され、一定時間が経過すると自動的に閉じる動作を実装します。ユーザーが閉...
ポップオーバー

×ボタンで閉じられるポップオーバーの作り方【HTML/CSS/JavaScript・サンプルコード付き】

×ボタンで閉じられるポップオーバーの作り方 ×ボタンで閉じられるポップオーバーの作り方を紹介します。このサンプルでは、ボタンをクリックするとポップオーバーが表示され、ポップオーバー内に配置した×ボタンをクリックすると閉じる仕組みをHTML・...
ドロップダウンメニュー

スワイプ・ドラッグで閉じられるドロップダウンメニューの作り方【HTML/CSS/JavaScript・サンプルコード付き】

スワイプ・ドラッグで閉じられるドロップダウンメニューの作り方 スワイプ・ドラッグで閉じられるドロップダウンメニューの作り方を紹介します。このサンプルでは、「メニュー」ボタンをクリックするとドロップダウンメニューが表示され、画面上をスワイプま...
ドロップダウンメニュー

×ボタンで閉じられるドロップダウンメニューの作り方【HTML/CSS/JavaScript・サンプルコード付き】

×ボタンで閉じられるドロップダウンメニューの作り方 ×ボタンで閉じられるドロップダウンメニューの作り方を紹介します。このサンプルでは、「メニュー」ボタンをクリックすると項目一覧が表示され、メニュー内の右上にある「×」ボタンをクリックすると閉...
ドロワーメニュー

指定時間後に自動で閉じるドロワーメニューの作り方【HTML/CSS/JavaScript・サンプルコード付き】

指定時間後に自動で閉じるドロワーメニューの作り方 指定時間後に自動で閉じるドロワーメニューの作り方を紹介します。このサンプルでは、画面左側から表示されるドロワーメニューを作成し、メニューを開いたあと一定時間が経過すると自動で閉じる動作を実装...
ポップオーバー

ESCキーで閉じられるポップオーバーの作り方【HTML/CSS/JavaScript・サンプルコード付き】

ESCキーで閉じられるポップオーバーの作り方 ESCキーで閉じられるポップオーバーの作り方を紹介します。このサンプルでは、HTML・CSS・JavaScriptを使用し、ボタンをクリックするとポップオーバーを表示し、キーボードのESCキーを...
ステップバー

基本のステップバーを作る方法【HTML/CSS/JavaScript・サンプルコード付き】

基本のステップバーを作る方法 基本のステップバーをHTML・CSS・JavaScriptで作る方法を紹介します。このサンプルでは、「次へ」「戻る」ボタンを押すだけで現在のステップが切り替わり、進行状況を分かりやすく表示できます。JavaSc...
フッター

基本のフッターを作る方法【HTML/CSS・サンプルコード付き】

基本のフッターを作る方法 Webページの最下部に表示する基本のフッターをHTMLとCSSで作る方法を紹介します。このサンプルでは、サイト名、案内リンク、コピーライトをまとめたシンプルなフッターを作成します。JavaScriptを使用せず、H...