반응형웹 질문좀드려요~~~~ ㅠㅠ
안녕하세여 퍼블리셔
선배님들
다름이 아니라 윈도우 리사이즈에 관한 질문인데요
$(document).ready(function(){ gnbControl(); });
$(window).resize(function(){ gnbControl(); });
function gnbControl( ) {
var wrap_w = $(window).width();
if (wrap_w >= 1270){
$(".gnb > li").unbind();
gnb01();
} else {
$(".gnb > li").unbind();
gnb02();
}
}
var wrap_w = $(window).width();
if (wrap_w >= 1270){
$(".gnb > li").unbind();
gnb01();
} else {
$(".gnb > li").unbind();
gnb02();
}
}
function gnb01(){
$(".gnb > li").bind("mouseenter focusin",function(){
$(".mBox").animate({"width":"1500px"});
});
$(".gnb > li").bind("mouseleave focusout",function(){
$(".mBox").animate({"width":"500px"});
});
}
$(".gnb > li").bind("mouseenter focusin",function(){
$(".mBox").animate({"width":"1500px"});
});
$(".gnb > li").bind("mouseleave focusout",function(){
$(".mBox").animate({"width":"500px"});
});
}
function gnb02(){
$(".gnb > li").bind("mouseenter focusin",function(){
$(".mBox").animate({"width":"200px"});
});
$(".gnb > li").bind("mouseleave focusout",function(){
$(".mBox").animate({"width":"100px"});
});
}
$(".gnb > li").bind("mouseenter focusin",function(){
$(".mBox").animate({"width":"200px"});
});
$(".gnb > li").bind("mouseleave focusout",function(){
$(".mBox").animate({"width":"100px"});
});
}
.mBox {width:100%;height:50px;margin-top:50px;background:url('../images/') green;}
여기서 window 가 1270 인상태로
gnb li 영역에 마우스가 올려졌다가 나온상태가 되면
mBox 의 넓이가 500이 되는데
1270 이하로 내려갔을때도
mBox 의 넓이가 500이 됩니다.
1270 이하일때는
gnb01 로 발생한 모든 액션들이 제거 됬으면 좋겠거든요
gnb01 에
$(".mBox").css({"width":"100%"}); 추가하면 되지만
다잡아야 할부분들이 너무 많아서 ㅠㅠ
이런방법말고
window 가 1270 이하일때는
gnb01 로 인해 발생한 액션들을 삭제하고
gnb02 만 적용시키고
window 가 1270 이상일때는
gnb02로 인해 발생한 액션들을 삭제하고
gnb01만 적용시키고 싶습니다
새로고침같은 방법말고 좋은 방법좀 알려주세요~~~
부탁드려요 선배님들 ㅠㅠ
|
댓글을 작성하시려면 로그인이 필요합니다.
로그인
프로그램
태그 필터 (최대 3개)
전체
개발자
소스
기타
mysql
팁자료실
javascript
php
linux
flash
정규표현식
jquery
node.js
mobile
웹서버
os
프로그램
강좌
썸네일
이미지관련
도로명주소
그누보드5
기획자
견적서
계약서
기획서
마케팅
제안서
seo
통계
서식
통계자료
퍼블리셔
html
css
반응형
웹접근성
퍼블리싱
표준화
반응형웹
홈페이지기초
부트스트랩
angularjs
포럼
스크린리더
센스리더
개발자톡
개발자팁
퍼블리셔톡
퍼블리셔팁
기획자톡
기획자팁
프로그램강좌
퍼블리싱강좌
댓글 2개
주말에 공부해봐야겠어요..