旅好きフリーランスの備忘録

プログラミング勉強日記

html・css

: cssでoverflow: auto;をあてた横スクロールするtableの右側に余白をつける方法

2024/10/30

「overflow-x: auto;」で横スクロール可能な表の右側に余白を設ける方法を解説。疑似要素を活用し、シンプルなコードで実現しています。

html・css

: モーダルやハンバーガーメニューを開いたときに絶対に背景を動かないようにするコード（iOSも対応）

2024/10/23

モーダルやハンバーガーメニューを開いた際に、背景を動かさないための実装方法を紹介。iOSでも対応可能なコードで、スマホでの背景固定にも対応しています。

html・css js・jquery

: swiper.jsを使用して、右上から左下に向かって階段式に斜めに流れ続けるスライドショー

2024/10/21

swiper.jsを使用し、右上から左下に向かって階段式に流れる無限ループスライダーを実装する方法を解説。シンプルなCSSとJSでの実装も紹介。

html・css js・jquery

: 要素がビューポートの中にあるときだけクラスをつけて背景色を変更する実装

2024/10/18

要素がビューポート内にある間だけクラスを付け、視覚効果を追加する方法を紹介。滑らかなアニメーションで背景色が変わる実装例も解説します。

html・css js・jquery

: アコーディオン（複数開くのOK ver）

2024/10/15

複数のアコーディオンを同時に開ける仕様を実装。クリックで開閉する簡単なjQueryコードを使い、シンプルなアコーディオンの作り方を解説します。

html・css js・jquery

: アコーディオン（同時に開くのは1つのみ、他のは閉じるver）

2024/10/15

複数のアコーディオンの中で1つだけ開く仕様を実装。クリックで他のアコーディオンを閉じ、選択した項目のみ開く方法をjQueryを使って解説します。

html・css js・jquery

: 周りが暗くなくても使える、スポットライトのような光のぼやっとしたマウスストーカー

2024/10/14

特定エリアのみで表示される美術館風のマウスストーカーを実装しました。背景を暗くせず、PC専用の要件に対応。CSSとjQueryを使用し、マウスの動きに追従するエフェクトを実現しています。

html・css js・jquery

: ハンバーガーメニュー決定版

2024/10/22

iOS 15のモーダルバグに対応し、スマホでのみ背景固定を行うハンバーガーメニューの実装方法を解説。ハンバーガーメニュー開閉や背景スクロールの制御をjQueryで実現し、iOS特有の高さやスクロールに関連する問題を解消します。

html・css js・jquery

: 背景動画をvideoタグで作成してautplay属性をつけているのに、iPhoneで再生ボタンが表示されてしまう件

2024/10/14

iPhoneの省エネモードで背景動画が自動再生されない問題についての解決策を紹介。autoplay属性ではなく、JSの.play()を使用して背景動画を再生する方法を提案し、実際に発生した不具合の原因と対処法をまとめています。

html・css js・jquery

: jQueryの使い方

2024/10/14

jQueryを使った基本的な操作や導入方法を解説した記事です。CDNを使った簡単な読み込み方法から、DOM操作、イベントハンドリング、アニメーションなどの基礎的な例を紹介しています。

html・css

1 2 Next »