웹프로그래밍/Javascript|JQuery|Jsp
브라우저 사이즈에 따라 탑메뉴 조정
Seras
2017. 9. 19. 13:15
반응형
브라우저 사이즈에 따라 탑메뉴 조정
$(document).ready(function(){
//새로 고침 했을 경우 사이즈를 체크 하여 display 속성을 변경해줌
if($(window).width() < 1379){
$('#header_area #topmenu li').css('display','none');
}else{
$('#header_area #topmenu li').css('display','block');
}
//브라우저사이즈가 변경될때마다 체크 하여 display 속성을 변경해줌
$(window).resize(function(){
if($(window).width() < 1379){
//창을 줄여봤을때 1379 보다 작아지면 탑메뉴 li를 숨긴다.(겹쳐지기 때문)
$('#header_area #topmenu li').css('display','none');
}else{
//창이 다시 커질 경우 보여준다.
$('#header_area #topmenu li').css('display','block');
}
});
});
응용해서 하시길 바랍니당~!
반응형