js를 미디어쿼리처럼 사용하기 (matchMedia)

$(function(){
  fn_widthResize();
})

function fn_widthResize() {
	if (window.matchMedia('(max-width: 1024px)').matches) {
		// 태블릿
		$('.branch').off().click(function() {
			$('.branch > div').css({ height: "auto" });
			$('.branch > div').slideToggle();
			$('.lang > ul').slideUp();
			$('.remote').toggleClass('hide');
		});
		$('.lang').off().click(function() {
			$('.lang > ul').slideToggle();
			$('.branch > div').slideUp();
		});
	
	} else {
		// PC
		$('.branch').off().hover(function() {
			$(this).children('div').stop().slideDown();
		}, function() {
			$(this).children('div').stop().slideUp();
		});

		$('.lang').off().hover(function() {
			$(this).children('ul').stop().slideDown();
		}, function() {
			$(this).children('ul').stop().slideUp();
		});
	};

};

 

 

 

참고사이트

https://frontdev.tistory.com/entry/%EB%AF%B8%EB%94%94%EC%96%B4%EC%BF%BC%EB%A6%AC%EB%A5%BC-%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8%EC%97%90%EC%84%9C-%EC%82%AC%EC%9A%A9%ED%95%B4%EC%95%BC%EB%90%A0-%EB%95%8C