답변 2개
채택된 답변
+20 포인트
3년 전
1.
이 2줄을 삭제한 후에
/theme/53/css/mobile_shop.css 파일에서 아래 부분 수정
#hd_mb li{float:left;background:#fff;border-bottom:1px solid #eee;width:50%;position:relative;z-index:9;text-align:center;padding:10px 0}
2.
</p>
<p> $( document ).ready( function() {
var jbOffset = $( '#hd_mb' ).offset();
$( window ).scroll( function() {
if ( $( document ).scrollTop() > jbOffset.top ) {
$( '#hd_wr' ).addClass( 'fixed' );</p>
<p> $( '#hd_mb' ).addClass( 'fixed' );
}
else {
$( '#hd_wr' ).removeClass( 'fixed' );</p>
<p> $( '#hd_mb' ).removeClass( 'fixed' );
}
});
});</p>
<p>
로그인 후 평가할 수 있습니다
답변에 대한 댓글 5개
m
magicpjy
3년 전
e
eyekiss
3년 전
1. 올려주신 소스는 50% 입력이 안되어 있네요..
css 는 ctrl + f5 해야 적용되는건 아시죠??
2. 짐작으로 올린 소스라서.. 안될수도 있습니다.
제가 직접 해보면서 방법을 찾아야하는 부분이라..ㅜㅜ
아래 소스 올려보고 되는지 확인해보세요.
$( document ).ready( function() {
var jbOffset = $( '#hd_mb' ).offset();
$( window ).scroll( function() {
if ( $( document ).scrollTop() > jbOffset.top ) {
$( '#hd_mb' ).addClass( 'fixed' );
}
else {
$( '#hd_mb' ).removeClass( 'fixed' );
}
});
});
css 는 ctrl + f5 해야 적용되는건 아시죠??
2. 짐작으로 올린 소스라서.. 안될수도 있습니다.
제가 직접 해보면서 방법을 찾아야하는 부분이라..ㅜㅜ
아래 소스 올려보고 되는지 확인해보세요.
$( document ).ready( function() {
var jbOffset = $( '#hd_mb' ).offset();
$( window ).scroll( function() {
if ( $( document ).scrollTop() > jbOffset.top ) {
$( '#hd_mb' ).addClass( 'fixed' );
}
else {
$( '#hd_mb' ).removeClass( 'fixed' );
}
});
});
m
magicpjy
3년 전
1. css 수정후 ctrl + f5를 해야 하는군요 ... (ctrl+f5) ok .저장 기록
pc를 모바일 보기로 했을때 원하는 대로 나왔어요
만세~ (^^)(_ _) 꾸벅 감사합니다
2. 실행후 둘다 안보여요
혹시나 알려주신내용에 상세설명이 있을까하여 인터넷에 css ,상단고정 검색하니 #position:fixed
문자도 나오던데 .. 관련 있을 까요?
pc를 모바일 보기로 했을때 원하는 대로 나왔어요
만세~ (^^)(_ _) 꾸벅 감사합니다
2. 실행후 둘다 안보여요
혹시나 알려주신내용에 상세설명이 있을까하여 인터넷에 css ,상단고정 검색하니 #position:fixed
문자도 나오던데 .. 관련 있을 까요?
e
eyekiss
3년 전
$( '#hd_mb' ).addClass( 'fixed' );
이 소스가 #hd_mb 에 fixed 를 추가해주는 겁니다.
이 소스가 #hd_mb 에 fixed 를 추가해주는 겁니다.
m
magicpjy
3년 전
감사합니다
일단 스크롤은 원상복귀 해놓았어요
알려주신 소스를 잘 활용해서 고민을 해보겠습니다
일단 스크롤은 원상복귀 해놓았어요
알려주신 소스를 잘 활용해서 고민을 해보겠습니다
댓글을 작성하려면 로그인이 필요합니다.
3년 전
개발 아이디어 드립니다.
우선 모바일 접속인것을 확인해야 합니다.
화면 크기로 나누고 계신다면 @media screen and(max)~~~ 이렇게 해서 모바일 화면 구분한 후
나오게 안할 부분을 visibility: hidden; 으로 하시면 될것 같습니다.
display를 이용하면 아예 해당 부분이 없어지고 visibility는 공간은 있고 보이지 않게만 합니다.
모바일 기기로 접속하는것을 구분한다면 그누보드 기본 파일에 보시면 IS_MOBILE 이렇게 되어 있는 부분이 있을 것입니다. 이것을 이용해서 하시면 될것 같습니다.
참고 링크
로그인 후 평가할 수 있습니다
답변에 대한 댓글 1개
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인
1.삭제를 하고 css부분 50%로 고쳤는데 빈공간은 회색으로 나옵니다
css부분에 추가적으로 수정해야 하는게 아닐까 하여
소스 적습니다
[code ]/* 상단 레이아웃 */
#hd {position:relative;}
#hd h1 {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden}
#hd_wr{position:relative;height:70px;padding:10px;background:#fff;
-webkit-box-shadow: 0 0 5px rgba(55,55,5,0.4));
-moz-box-shadow: 0 0 5px rgba(55,55,5,0.4));
box-shadow: 0 0 5px rgba(55,55,5,0.4);}
#hd #hd_btn button{height:50px;width:40px;border:0;background:0;font-size:16px;vertical-align:top;float:left}
#hd #hd_btn a{display:inline-block;height:50px;line-height:50px;width:40px;border:0;background:0;text-align:center;font-size:16px;vertical-align:top;float:left}
#hd_btn .cart-count {position: absolute;top: 20%;right: 0px;display: block;height: 16px;line-height: 16px;border-radius: 8px;background: #ff4444;font-size: 11px;color: #fff;padding: 0 5px;}
#btn_hdcate{position:absolute;top:10px;left:0}
#hd #hd_btn a{position:absolute;top:10px;right:5px}
#hd #btn_hdmy{position:absolute;top:10px;right:45px}
#hd #logo{text-align:center;margin-top:10px}
#hd #logo img{height:auto;max-height:27px;width:auto}
#hd_wr.fixed{position:fixed;top:0;left:0;width:100%;z-index:999;height:50px}
#hd_wr.fixed #btn_hdcate,#hd_wr.fixed #hd_btn a{top:0}
#hd_wr.fixed #logo{margin-top:5px}
#hd_mb:after {display:block;visibility:hidden;clear:both;content:""}
#hd_mb li{float:left;background:#fff;border-bottom:1px solid #eee;width:25%;position:relative;z-index:9;text-align:center;padding:10px 0}
#hd_mb li a{display:block;border-left:1px solid #eee;font-size:0.92em;color:#666}[/code]
2.알려주신 소스 붙여넣기 하였으나 고정이 안되는 것을 확인하였습니다
추가고정하고자 하는 라인이 hd_mb는 확인하였는데 mb라인은 고정이 안되네요
이건 뭔가요? 아래쪽에 mb를 추한것으로 보아 var jbOffset = $( '#hd_mb' ).offset(); 이곳도 mb와 wr 둘다 추가적으로 들어갸야 할것 같은 기분....?