2026, 새로운 도약을 시작합니다.

우측 사이드바를 만들고 있는 중입니다. 채택완료

현재 사이드바에는

position: fixed;

top: 38px;

이렇게 되어있는데..

스크롤이 되면서 자동으로 1씩 줄어들어서.. top : 0이 되면 자동으로 0으로 고정이 되고..

다시 맨위쯤에 갔을때는 1씩 늘어나서 top : 38px 로 되는 스크립트를 구현하고 싶습니다.

참고로 맨 상단에는 배너부분이 열고 닫고가 되어있어서..

배너부분이 닫혀있을땐 38px이지만, 배너부분이 열려있으면 147px 입니다.

147px일때도 역시나 스크롤이 될때 1씩 줄어들어서 0이되면 상단에 딱 붙어야합니다.

많은 조언 부탁드립니다.

참고 사이트는

http://mall.hyundailivart.co.kr/front/index.lv 

여기에서 우측 사이드바입니다.

답변 2개

채택된 답변
+20 포인트

페이지를 아래와 같이 만드시면 되지 않을까 싶습니다.

테스트 : http://btstocking.mooo.com/test/scroll


Copy
        Scroll					body{			margin: 0px;			padding: 0px;		}		#header {			background-color: #000;		}		#banner {			height: 109px;			background-color: #00F; 		}		#menu {			height: 38px;		}		#toggle_button {			color: #fff;		}		#side_bar {			position: fixed;			top: 147px;			right: 0px;			width: 200px;			height: 300px;			background-color: #f00;		}		#content {			width: 728px;			height: 1200px;			margin: auto;			background-color: #F1F1F1;		}	BANNERbanner  	header_h = $('#header').outerHeight(true);	$('#toggle_button').click(function(){		$('#banner').toggle();		header_h = $('#header').outerHeight(true);		$('#side_bar').css("top", header_h);	});	$(document).scroll(function(){		scroll_pos = $(this).scrollTop();		new_top = header_h - scroll_pos;		if(new_top 
로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

저를 위해 테스트 페이지까지 만들어주시다니 정말 감사합니다.

(- -) (_ _)

댓글을 작성하려면 로그인이 필요합니다.

되지도 않는 내용 알려드렸다가 고생만 가중시켜 드릴 순 없어서 만들어 봤습니다.

알려드린 내용이 잘 적용 되었으면 좋겠습니다.

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인
🐛 버그신고