25

particle.jsで作る、インタラクティブなパーティクル背景

particle.jsとjQueryを組み合わせて、スクロールとマウスの動きに合わせて変化するパーティクル背景を作成しました。

使用技術

  • HTML/CSS/JavaScript: ページの構造とスタイル、インタラクション
  • particles.js: パーティクル背景の実装
  • jQuery: DOM操作ライブラリ

制作意図

  • スクロールに合わせたインタラクションを実装
  • パーティクル背景で視覚効果を追求
  • jQueryの習得

こだわりポイント

  • スクロール位置に合わせたナビゲーションバーの挙動
  • 現在のタブを示すスライダーUI
  • パーティクル背景のマウス応答性

HTML/CSS/JSとライブラリを組み合わせ、インタラクティブなページを実装しています。 スクロール連動のUIとパーティクル背景の視覚効果に注力しました。