JavaScript スクロールで数字が増えるカウントアップアニメーション「jquery-numerator.js」
サイト制作をしていると、こんな要望が出てくることがあります。クライアント画面をスクロールしたら、数字がゼロから特定の値まで増えていくアニメーションを付けたいんだけど。どういうことか言うと、採用サイトやコーポレートサイトなどで、何らかの数値を...
JavaScript
JavaScript 
ライブラリ ScrollHintの使い方｜スマホで横スクロールに気づかせるUIの実装方法
Webサイトをコーディングしているときに、テーブルや横長の画像は、スマホのような画面幅が狭いブラウザで閲覧するときに、縮んでしまってみづらくなったりデザインが崩れてしまうことがありますよね。そんな時は、CSSでoverflow-x: aut...
CSS Swiperでページネーションの左右に「前へ / 次へ」ボタンを配置する方法
Swiperを使ってスライダーを作る際に、ページネーション（dots）の左右に「前へ / 次へ」ボタンが並んでいるデザインを実装するケースがたまにあります。例えば、以下のような画像のものです。Swiperのドットの左右に、「前へ/次へ」ボタ...
JavaScript 【CSSのみ】Swiperスライダーのページネーションを縦並びにする方法【pagination】
Swiperのスライド方向は横のまま、ページネーションだけを縦並びにしたい場合は、JavaScriptのdirectionオプションではなくCSSで配置を変えます。この記事では、ページネーションをPCでは縦、スマートフォンでは横に切り替える...