フロントエンドエンジニアの岡田です。 本日、夜行バス比較なびでは、プレミアムフライデー用の特集ページをリリースいたしました。 www.bushikaku.net こちらの特集でつかった、スクロールできるタブの実装についてご紹介します。 スマホ用のページの以下の部分です。 こちらは、FlexSliderというプラグインを使っています。 画像のスライダーやカルーセルを実装するときに使う、jQueryプラグインです。 woocommerce.com オプションは以下のように設定しました。 $('#region-tab').flexslider({ animation: "slide", selector: ".slides > li:visible", slideshow: false, animationLoop: false, controlNav: false, directionNav:
![スクロールするタブはスライダーのプラグインで実装できる - LCL Engineers' Blog](https://cdn-ak-scissors.b.st-hatena.com/image/square/a1a295ca1daf607ed15164613f8bd7adef209cc9/height=288;version=1;width=512/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fl%2Flcl-engineer%2F20170308%2F20170308174857.gif)