On Scroll Animate/SlideUp div

Question

안녕하세요, 저는 하루 종일 인터넷 검색을 해왔지만이를 달성하는 방법에 대한 답을 찾을 수 없습니다. 스크롤하면 화면 하단의 div 위치가이 사이트와 동일하게 확대됩니다.

http://www.chanel.com/en_SG/. 도와 주셔서 감사합니다.

Answer 1

이것은 jQuery를 사용하여 수행 할 수 있습니다. (http://jsfiddle.net/ujmMk/5/)

$(function(){ 
    $(window).scroll(function(){ //onscroll 
     var scrolleddown = false;//used to keep the state 
     if($(window).scrollTop() > 1){ //if they've scrolled down 
      if(scrolleddown == false){ 
       scrolleddown = true; 
       $('#content').stop(true, false).animate({top:'0%'},500,function(){//show it 
        $('#topcontent').hide();//hide to original content, in this case "hi!"'s 
        $(this).css("position","relative"); //make it be able to scroll down 
       }); 
      } 
     }else{ 
      //below resets everything back to original state when user scrolls back up 
      scrolleddown = false; 
      $('#topcontent').show(); 
       $('#content').css("position","fixed").stop(true, false).animate({top:'99%'},500) 
     } 
    }); 
}); 

: 여기

당신이 사용할 수있는 몇 가지 기본 예제