0

id="header"のdivと別のdivid= "logo"（ "position：absolute"）があり、その内部はヘッダーdivよりも高くなっています。

ページを下にスクロールするときは、ヘッダーをウィンドウの上部に貼り付け（問題なく機能します） 、ロゴを上にスライドして、ロゴ-125pxのごく一部だけが表示されるようにします。

下にスクロールするときに上にスライドしてもエラーは発生しませんが、上にスクロールして#logo戻ると、元の位置に戻るのに大きな遅延が発生します。

これが私のコードです：

jQuery：

var top = jQuery('#header').offset().top;
jQuery(window).scroll(function() {
     if(jQuery(this).scrollTop() > top) {
        jQuery('#header').addClass('header_fixed');
        jQuery('#content').addClass('content_fixed');           
    } else {
        jQuery('#header').removeClass('header_fixed');                  
        jQuery('#content').removeClass('content_fixed');
    }
    if(jQuery('#header').hasClass('header_fixed')) {
        jQuery('#logo').animate({top:'-125px'}, 500);
    } else {
        jQuery('#logo').animate({top:'0px'}, 500);
    }
});

ありがとうございました。

4

1 に答える 1

2

返されたスクロールを速くするには、これを試してください：

var scroll = 0;
var scrolled = false;

jQuery(window).bind('scroll', function(e) {
     if(jQuery(this).scrollTop() > scroll){
         if(scrolled == false){
            jQuery('#logo').animate({top:'-125px'}, 500);
            scroll = jQuery(this).scrollTop();
         }       
        scrolled = true;
    } else {
        if(scrolled == true){
            jQuery('#logo').animate({top: 0}, 500);
            scroll = 0;
        }       
        scrolled = false;            
    }
});

あなたが望むものかどうかはわかりません。これは例です。例

于 2012-06-27T15:12:58.270 に答える