忍者ブログ
09 April

スクロールしたいがスクロールバー非表示

だらだらメニューが長いスマホメニューとかでよくある
jqueryいれたらoverflow:hidden;かかってて、子メニューが多いやつで困ることがある

https://oar.st40.xyz/article/105

このサイトのありがたいコードを貼り付けることにより解決する
firefoxについて書いてないが、これいれてfirefoxでも大丈夫だった

Chrome　safari
.scrollbar_none{
    overflow-y:auto;
}
.scrollbar_none::-webkit-scrollbar{
    display:none;
}
IE
.scrollbar_none{
    -ms-overflow-style:none;
}
PR
29 March

枠線アニメーション

https://zxcvbnmnbvcxz.com/12-css3-border-animate/index.html
https://zxcvbnmnbvcxz.com/demonstration/border.php.html

いつか使いたい時ように・・・
29 March

ヘッダーメニュー　スクロールしたらclass名追加

https://qiita.com/gatespace/items/a9fa68dacc2e30f7f219
https://jsfiddle.net/gatespace/66hhetbr/

(function($) {
  // masthead scroll
  var header = $('#masthead'); // fixed DOM
  var adclass = 'scrolled'; // add css class
  var scrollY = 0; // scroll
  $(window).scroll(function() {
    if ($(window).scrollTop() > scrollY) {
      header.addClass(adclass);
    } else {
      header.removeClass(adclass);
    }
  });
})(jQuery);

ありがたいコード
スクロールしたらclass名追加して、そのclass名に対して
positon:fixed;とcssアニメーションをつける
よくみたらwpフォーラムで昔見かけていた回答者の人だった
この方は簡潔に書くので無駄な情報がなく読みやすいです