Responsive script


```javascript:qiita.rb
//append ksk 20180615 dimmed 화면 가장 빨리 로드
window.onload = function() {
  var element = document.getElementById("dimmed");
  element.classList.remove("active");
}


$(function() {
  //변수 선언
  var body = $('body'),
    nav = $('#nav'),
    menu = nav.find('#menu'),
    browserWidth = window.innerWidth,
    menuTop = $('.pagetop'),
    dimmed = $('#dimmed');
    toggleM = $('.menu-toggle'),
    wrapper = $('#wrapper');

  // 현재 스크롤 값 알아내기
  var getCurrentScroll = function() {
    return window.pageYOffset || document.documentElement.scrollTop;
  }

  // 아코디언 
  function accordion() {
    $('.accordion').off('click', '.accordion__head');
    $('.accordion').on('click', '.accordion__head', function(e) {
      e.preventDefault();
      
      var $accordion = $(this).closest('.accordion');
      console.log($accordion);
      if (!$accordion.hasClass('open')) {
        $(this).addClass('active');
        $accordion.addClass('open').children('.accordion__body').stop().slideDown();

      } else {
      $(this).removeClass('active');
        $accordion.children('.accordion__body').stop().slideUp(function(){
          $accordion.removeClass('open')
        });
      }
      
    });
  }

  // reset news & topic images 이미지 리사이징
  function imgResizing() {
    var newsBody = $('.news-body');
    newsBody.find('img').attr({
      width:"",
      height:""
    })
  }

  function toggleMenu() {   
    nav.toggleClass('active');
    dimmed.removeClass('active');
    dimmed.toggleClass('active');
    // 현재 nav 가 active class 가 없을때
    if (!nav.hasClass('active')) {
      var scroll = getCurrentScroll();
      if (scroll>=50) {
        menuTop.fadeIn();
      }else {
        menuTop.fadeOut();
      }      
      nav.stop(true,true).slideUp();      
      toggleM.removeClass('on').addClass('off');
      dimmed.removeClass('active');
    } else {
      menuTop.fadeOut();
      nav.stop(true,true).slideDown();
      toggleM.removeClass('off').addClass('on');
      dimmed.addClass('active');
    }
  }

  // event listener
  toggleM.on('click', function(e){
    e.preventDefault();
    toggleMenu();
  }); 

  dimmed.on('click', function(){
    $(this).removeClass('active');
    menuTop.fadeIn();
    nav.removeClass('active');
    nav.stop(true,true).slideUp();
    toggleM.removeClass('on').addClass('off');    
  });

  function resetTriggers(){
    menu.find('li').unbind('mouseenter');
    menu.find('li').unbind('mouseleave');
  }

  function setTriggers() {
    $(".menu-list li").hover(function() {
      $(this).children('.pull-nav').show();
      $(".menu-list li.sub-pull").hover(function() {
        $(this).children('.pull-nav2').show();
      }, function() {
        $(this).children('.pull-nav2').hide();
      });
    }, function() {
      $(this).children('.pull-nav').hide();
    });
  }

  function fixedAni(){
   var shrinkHeader = 10;
   var headerTop = $('#header-top');
   
   $(window).scroll(function(){
      var scroll = getCurrentScroll();   
      if (scroll>=shrinkHeader) {
        headerTop.addClass('shrink');
      }
      else {
        headerTop.removeClass('shrink');
      }       
   });
  }

//topに戻るスクロール
pageTop();
function pageTop() {
  var browserWidth = window.innerWidth;
  var topBtn = $('.pagetop');
  
  if (browserWidth <= 768) {
    topBtn.hide();
    $(window).scroll(function(){
      var shrinkHeader = 50;
      var scroll = getCurrentScroll();
      if (scroll>=shrinkHeader) {
          topBtn.fadeIn()
      }else {
          topBtn.fadeOut();
      }
    })
  } 

  topBtn.click(function () {
    $('body,html').animate({
      scrollTop: 0
    }, 1000);
    return false;
  });  
}

  windowCheckNav();
  function windowCheckNav() {

    var nav = $('#nav'),
      menu = $('menu'),
      browserWidth = window.innerWidth,
      srhBx = $('.search-bx'),
      breadcrumbs = $('#breadcrumbs'),
      snsBx = $('.sns-bx'),
      logo = $('#logo'),
      srhBx = $('.search-bx'),
      utilMenu = $('.util-menu'),
      articleTitle = $('.article-title'),
      arrTit = [
        'ニュース&トピックス',
        'お知らせ',
        '言万葉ブログ',
        'ピックアップ'
      ],
      arrTitImg = [ 
        "./images/title_news.png",
        "./images/title_oshirase.png",
        "./images/title_blog.png",
        "./images/title_pickup.png"
      ],    
      readMore = $(".read-more a"),
      newsMore = $(".news-more"),
      txtMore =  "./images/more.png",
      menuTop = $('.pagetop');

    if (browserWidth <=768) {
      //mobile
      resetTriggers();
      nav.addClass('mobile');
      nav.removeClass('desktop');

      if (!nav.hasClass('active') && nav.is(':visible')) {
        nav.hide();
      }

      if (nav.hasClass('mobile')) {

       fixedAni();
       accordion();

        toggleM.show();
        utilMenu.insertAfter('.menu-list');
        snsBx.insertBefore('.footer-address');
        utilMenu.append(srhBx);
        $("#footer-info").insertAfter("#nara-group");
        // main h1
        $( ".tit-m-01").text(arrTit[0]);
        $( ".tit-m-02").text(arrTit[1]);
        $( ".tit-m-03").text(arrTit[2]);
        $( ".tit-m-04").text(arrTit[3]);

        var path = "/07_tomigaoka_re2/common/images/header_t/";
        // sns
        $('li.facebook img').attr('src',path +'ico-m-facebook.png');
        $('li.twitter img').attr('src',path +'ico-m-twitter.png');
        $('li.google img').attr('src',path +'ico-m-google.png');
        $('li.line img').attr('src',path+'ico-m-line.png');        
        // more button
        readMore
        .find('img')
        .replaceWith("<span> 一覧をみる</span>");

        newsMore
        .find('img')
        .replaceWith("<span>記事を読む！</span>")

        // breadcrumbs
        breadcrumbs
        .insertAfter('.top-catch');

        menuTop
        .find('img')
        .attr('src','/07_tomigaoka_re2/t_ele/common/images/f_top_img.png')
        .attr({
          width: "40px",
        });
      }
    } else {
      // desktop  
      nav.addClass('desktop');
      nav.removeClass('mobile');
      dimmed.removeClass('active');
      
      if (nav.hasClass('active')) {
        nav.removeClass('active');
      }

      if (!nav.hasClass('active') && nav.is(':hidden')) {
        nav.show();
      } 

      if (nav.hasClass('desktop')) {
        
        $('.menu-toggle').hide().addClass('off');
        $('.header-menu').prepend($('.util-menu'));
        $('.sns-bx').insertAfter('.util-menu');
        $('.sns-bx').append($('.search-bx'));

        $( ".tit-m-01").html("<img src="+arrTitImg[0]+">"); 
        $( ".tit-m-02").html("<img src="+arrTitImg[1]+">");
        $( ".tit-m-03").html("<img src="+arrTitImg[2]+">");
        $( ".tit-m-04").html("<img src="+arrTitImg[3]+">");

        $('li.facebook img').attr('src',path +'facebook.png');
        $('li.twitter img').attr('src',path +'twitter.png');
        $('li.google img').attr('src',path +'googlep.png');
        $('li.line img').attr('src',path +'line.png');

        readMore
        .html("<img src="+txtMore+">");
        newsMore
        .html("<img src='./images/news_readmore.png'>");

        menuTop.
        find('img').
        attr('src','/common/images/footer/pagetop.png').attr({
          width:"auto"
        });
      }
      setTriggers();
    }
  }

  $(window).on('load resize', function() {
    windowCheckNav(); 
  });
})

//メニュー固定
$(function() {
  $(window).on('scroll', function() {
    if ($(this).scrollTop() > 100) {
      $('#header-top').addClass('fixed');
    } else {
      $('#header-top').removeClass('fixed');
    }
  });
});

//メニュープルダウン
$(function() {
	$(".menu-list li").hover(function() {
		$(this).children('.pull-nav').show();
	}, function() {
		$(this).children('.pull-nav').hide();
	});
});

// ページ内スクロール
$(function(){
	$('a[href^=#]').click(function(){
		var speed = 1000;
		var href= $(this).attr("href");
		var target = $(href == "#" || href == "" ? 'html' : href);
		var position = target.offset().top;
		$("html, body").animate({scrollTop:position}, speed, "swing");
		// タブとのバッティング防止
		$('a:not(.anchor[href*=#]');
		return false;
	});
});
```