[Program]/[Html & Javascript]
스크롤 따라다니는 이미지.^^
봉필v
2014. 4. 15. 10:14
따라 다니는 퀵메뉴 만들기
<!-- 퀵 메뉴 -->
<div style="float:right; top:50px; position:absolute; z-index:10; left:750px;" id="floater">
퀵메뉴에 들어갈 아이템 영역!!!
</div>
<!-- 퀵 메뉴 -->
<script language="javascript"type="text/javascript">
var lastScrollY = 0;
$(function(){
var diffY = document.documentElement.scrollTop;
// scroll event
$(window).scroll(function(){
var diffTop = Math.max(document.documentElement.scrollTop, document.body.scrollTop);
if (diffY != lastScrollY) {
percent = .10 * (diffY - lastScrollY);
if (percent > 0) {
percent = Math.ceil(percent);
} else {
percent = Math.floor(percent);
}
diffTop = parseInt($("#floater").offset().top) + percent;
lastScrollY = lastScrollY + percent;
}
$("#floater").stop();
$("#floater").animate({"top": diffTop}, 500);
});
});
</script>