matchMediaをつかってデバイスサイズ別のjavascriptを適用させる方法
cssであればメディアクエリをつかってデバイスサイズに応じたcssを適用させることは簡単です。では、javascriptの場合はどうでしょう？
javascriptではwindow.matchMediaというメソッドをつかって、設定したブレイクポイントごとに適用させるjavascriptを変えることができます。
他にも色々方法はあると思うのですが、このwindow.matchMediaをつかった方法が一番簡単なのではないでしょうか。
window.matchMediaをつかった実装例
<script type="text/javascript">
jQuery(document).ready(function($) {
//768px以上の場合
if (window.matchMedia( '(min-width: 768px)' ).matches) {
$(function(){
//768px以上のときのjavascriptをここに記述
});
//767px以下の場合
} else {
$(function(){
//767px以下のときのjavascriptをここに記述
});
};
});
</script>
