jquery - スクロールアニメーション/スライドアップ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)
        }
    });
});