グノシーとかNewsPicksとかMERYとかby.Sとかのアプリでよく見る、スワイプ(フリック?)で画面全体のカテゴリを切り替えるアレです。
そんな中、ギッハブに『グノシーとかNewsPicksとかMERYとかby.Sとかのアプリでよく見るスワイプ(フリック?)で画面全体のカテゴリを切り替えるアレ』をアップしたよ。俗に何ていうかわからないアレ。使ってみてね。https://t.co/jXOvPJPSLQ
— ⓐⓚⓘⓗⓘⓡⓞ①⑨⑦⑦ (@akihiro1977) 2016年12月13日
jQueryプラグインではありません、ごめんなさい
<link rel="stylesheet" type="text/css" href="js/category_swiper.css"> <script type="text/javascript" src="js/category_swiper.js"></script> <script type="text/javascript"> $(function(){ category_swiper.init(); }); </script>
<nav> <!-- カテゴリラッパーはCSSでfixedしています --> <div id="categories"> <!-- カテゴリリストのアンカーとコンテンツIDがひもづいています data-cs-categories は必須です --> <ul class="clearfix" data-cs-categories> <li><a href="#about">About</a></li> <li><a href="#use">使い方</a></li> ... <!-- アクティブカテゴリに追随するブロック、デザインはCSSで。 --> <span class="activeBar"></span> </ul> </div> </nav> <!-- コンテンツラッパーは data-cs-content-wrapper 必須 --> <div id="contents" data-cs-content-wrapper> <section> <!-- コンテンツは cs-contentクラスを。ここだけクラスダサいけど。 --> <div id="about" class="cs-content"> ... </div> </section> <section> <div id="use" class="cs-content"> ... </div> </section> ... </div>
他に書くこと無いので置いときます