1. /
  2. jQuery

jQuery

JSを画面サイズによって切り替え

JavaScript
1
2
3
4
5
6
7
8
9
$(function(){
        if(window.matchMedia('(max-width:767px)').matches) {
　　　　　　　　　　// 処理
        } else if (window.matchMedia('(min-width:768px) and (max-width: 999px)').matches){
　　　　　　　　　　// 処理
        } else {
　　　　　　　　　　// 処理
        }
});

使い勝手が良いのでメモ

ムッチャ使う ナビゲーションなどfixed

JavaScript
1
2
3
4
5
6
7
8
9
10
11
$(function($) {
var nav    = $('固定する要素'),
offset = nav.offset();
$(window).scroll(function () {
  if(jQuery(window).scrollTop() > offset.top) {
   nav.addClass('fixed');
} else {
  nav.removeClass('fixed');
   }
});
});

よく使うからメモ