[ajax] 스크롤 퀵메뉴바 만들기
로빈아빠
본문
<html>
<head>
제이쿼리 스크립트 인클루드
<script type="text/javascript">
$(function(){
var boxtop = $('#QuickTop').offset().top;
$(window).scroll(function(){ //윈도우에 스크롤값이 변경될때마다
$('#QuickTop').stop();//현재 박스를 멈추고
$('#QuickTop').animate({"top": document.body.scrollTop + boxtop}, 500);
//바디의 스크롤값에 처음 지정해놓은 박스값의 Top을 더한후 애니메이션 효과 주기
});
});
</script>
</head>
<body>
<div id="QuickTop" style="position:absolute; left: 600px; top: 100px; width: 50px; height: 50px; background-color: #EDEDED;">top</div>
<div style="height: 2000px;">내용</div>
</body>
</html>
<head>
제이쿼리 스크립트 인클루드
<script type="text/javascript">
$(function(){
var boxtop = $('#QuickTop').offset().top;
$(window).scroll(function(){ //윈도우에 스크롤값이 변경될때마다
$('#QuickTop').stop();//현재 박스를 멈추고
$('#QuickTop').animate({"top": document.body.scrollTop + boxtop}, 500);
//바디의 스크롤값에 처음 지정해놓은 박스값의 Top을 더한후 애니메이션 효과 주기
});
});
</script>
</head>
<body>
<div id="QuickTop" style="position:absolute; left: 600px; top: 100px; width: 50px; height: 50px; background-color: #EDEDED;">top</div>
<div style="height: 2000px;">내용</div>
</body>
</html>
관련링크
댓글목록
등록된 댓글이 없습니다.