125naroom
© 2025 125naroom
記事：34件
1ページ目
4
/
2025
【jQuery】タブ切り替え実装サンプル集（上下連動、下タブを押すとスクロールして上に、 外部ページからのリンクIDも可能）
少し複雑な『タブ切り替え』を実装してみました。 ▽今回の実装テーマ なんだか難しそうですねー できる自信がありませんねー もくじ シンプルなタブ切り替え 上下のタブの連動 下のタブを押すとスクロールして上にスクロールして
jQuery
デザインのメモ
1
【jQuery】プルダウンメニューでページ内リンク
プルダウンメニューで ページ内をスクロールさせてみましょう もくじ 実装サンプル メモ さいごに 実装サンプル See the Pen Pull-down menu / Link in page by 125naroom
7
11
2024
【jQuery】スライダープラグイン「slick」実装サンプル集
slick（スリック）の使い方をまとめてくださいー わかりましたー よく見かけるスライダー（自動再生） See the Pen 【jQuery】スライダープラグイン「slick」よく見かけるスライダー（自動再生） by
jQueryslick
10
【jQuery】チェックボックスにチェックを入れるとボタンが活性化する
利用規約に同意（チェック）するとー 申し込みボタンが活性化しますー こんな感じの依頼内容だったら 実装してみましょう See the Pen 【jQuery】チェックボックスのチェックを入れるとボタンが活性化する by
9
【jQuery】スクロール途中から追尾（fixed）、指定位置（class）で消える
jQueryを使って、スクロールの途中から追尾（fixed）、そして、指定の位置（class）で消える、というのを実装してみたいと思います。 なんだか複雑だー 理解できれば意外と簡単ですー 実装サンプル See the
SPONSORED LINK
広告
google
8
【jQuery】Lightboxプラグイン『Colorbox』の実装サンプル集
Lightboxプラグイン『Colorbox』の使い方と、制作に役立つ実装サンプルをまとめてみました。簡単に実装することができるのでおすすめです。（個人的には『PhotoSwipe』をおすすめしますが、jQueryではな
3
【jQuery】固定した背景画像がスクロールで切り替わる実装サンプル（スマホでも切り替わります）
スクロールすると固定した背景画像が切り替わる実装サンプルをまとめてみました。CSSだけで対応できると素敵なのですが『background-attachment: fixed;』がスマホだと効かないので、今回はjQuery
6
19
【jQuery】ページ内リンクでスムーズスクロール（固定ヘッダーがあったら）
するする動くと楽しいですねー 固定ヘッダーがある場合はクラスやIDを指定して高さ調整しましょうー JavaScript 固定のヘッダー（ナビ）がある場合はヘッダー分の高さを調整しなければなりません。レスポンシブだと高さが
5
31
【jQuery】『slick』を使って全画面表示のスライドショー
slickを使って全画面表示のスライドショーってできますかー レスポンシブを考えて『background』で対応してみましょうー 【実装】全画面表示（background対応） しっかりレスポンシブ対応したいので『bac
29
【jQuery】モバイルファーストが素敵な『fancybox3』実装サンプル集
Lightboxプラグイン『fancybox3』の使い方と、制作に役立つ実装サンプルをまとめました。とってもモバイルファーストに設計されているのでとってもおすすめです。 モバイルファーストですねー 共有ボタンもありますよ
28
【jQuery】iOS（Safari）だと100vhが少しはみ出てしまう対策
あ、iPhoneで見るとちょっとズレてますー そんな時はブラウザの高さを自動で取得しちゃえばOKですよー 画像を画面いっぱいに表示する（ブラウザサイズを自動で取得してiOS対策） See the Pen 【jQuery】
21
【jQuery】スクロールして表示領域に入ったら要素をアニメーション表示させる『inview.js』の実装サンプル集
jQueryの遅延（少し遅らせて表示させる、最近よく見かけるあれです）プラグイン『inview.js』の使い方と、制作に役立つ実装サンプルをまとめました。CSSのアニメーションと組み合わせることでサイト制作の幅がとっても
16
【jQuery】遅延表示『inview.js』と『lazysizes.js』を組み合わせて、『重いページよ、さようなら』
jQueryの遅延プラグイン『inview.js』と、画像の遅延表示ができる『lazysizes.js』を組み合わせるととてもいい感じだったので備忘録です。 ふわーっとできますかー 画像の読み込みを遅くして、コンテンツも
15
【jQuery】横並びの高さを揃える『matchHeight.js』実装サンプル集
横並びの要素の高さを揃えてくれるプラグイン『matchHeight.js』の使い方と、制作に役立つ実装サンプルをまとめました。「flexboxの中にあるこの部分の高さを揃えたいのだけど！」って言う時にはとってもおすすめで
14
【jQuery】クリッカブルマップ『RWD Image Maps』を使いこなせば、レスポンシブでもズレませーん
スマホだとクリッカブルがズレますー そんな時は『RWD Image Maps』を使いましょうー 【実装】丸でクリッカブルしてみました 画像サイズ（widthとheight）の指定は必須です。 See the Pen 【j
【jQuery】 ローディング、実装サンプル集
ローディングをまとめてみました。おしゃれなサイトさんはローディングを組み込んでいるなー、と思う今日この頃です。意外と簡単なのでお時間ありましたら組み込んでみてくださいませ。 ローディングを設定したいのですが難しいですかー
【jQuery】指定した場所までスクロールすると下からふわっと出てくる
あのー、下からふわっと出したいのですが、場所指定ってできますかー？ 場所指定、できますよー 【サンプル】指定した場所までスクロールすると下からふわっと出てくる まずはスクロールですねー See the Pen 【jQue
2
【jQuery】アコーディオン実装サンプル10選
jQueryのアコーディオン実装サンプルを作りました。サイト制作でよく使うものをまとめました。 いろいろありますねー いろいろあるのでまとめましたー アコーディオン、シンプル版 See the Pen アコーディオン、シ
30
2023
【jQuery】スクロールして、指定した場所から出てきて、指定した場所で消える
指定した場所で出したいのですよー そして指定した場所で消したいのですねー 実装サンプル See the Pen 【jQuery】スクロールして、指定した場所から出てきて、指定した場所で消える、実装サンプル by 125n
12
2022
【jQuery】規約を一番下までスクロールするとボタンが押せる
規約を一番下までスクロールするとボタンが押せるようにしたいのですができますかー？ ふむふむなるほど、よく見かけますねー、活性化ですねー、できますよー。 規約を一番下までスクロールするとボタンが押せる、実装 一番下までスク
【jQuery】アコーディオン、エリア外からのアンカーでアコーディオンが開く、そしてアンカー場所へ移動する。
あのー、アンカーリンクのボタンを押したらアコーディオンが開いてその中にあるアンカーリンクの場所にスルスルーと移動させたいのですが可能ですかね？ なんだかややこしそうですが、やってみましょうかー さっそく実装してみる Se
