エントリーの編集
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
記事へのコメント0件
- 注目コメント
- 新着コメント
このエントリーにコメントしてみましょう。
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
マウスの動きで背景パララックス - Qiita
#bg{ width: calc(100% + 20px); height: calc(100% + 20px); } const ww = window.innerWidth; const w... #bg{ width: calc(100% + 20px); height: calc(100% + 20px); } const ww = window.innerWidth; const wh = window.innerHeight; const hw = ww / 2; const hh = wh / 2; const pm = 20; // parallax margin const $bg = $('#bg'); const $box = $('#box'); $(window).on('mousemove', (e) => { // 中心から端までの距離を、余分に大きくとった背景画像の分(ここでは20÷2=10px)に割り当てる const mw = ( e.clientX - hw ) / hw * ( pm / 2 ); // 0.0 ~ 10.0 const mh =