2017-09-13 16 views
0

div要素には動的テキスト(10〜250)が含まれています。次に、ユーザーがボタンに到達したときにスティッキーのように振舞う必要があります。最初のdivにはプレーンテキストが含まれています。私はそれはいくつかのテキストのために働く$(document).scrollTop() <$(".scroller_anchor").offset().top -100を使用div.Ifこのすべてに スクロールが特定のdivに到達したときにdivをスティッキーにする

<div></div> //which contains plain text , stick to be available once user scroll to end of this. 
    <div class="scroller_anchor"></div> // sticky to become when user reached to this div. 
    <div> </div> // which one to behaves like sticky. 
    //Here is code 
    if(($(document).scrollTop() <$(".scroller_anchor").offset().top )){ 
    $('.scroller_anchor').css('height', '0px'); 
    $('.scroller').css({ 
     'position': 'relative' 
    }); 


    }else if ($(document).scrollTop() > ($(".scroller_anchor").offset().top)){ 
     $('.scroller').css({ 
      'position': 'fixed', 
      'top': '0px' 
     }); 
     $('.scroller_anchor').css('height', '50px'); 

    } 

は、DIVのみもみ以下のユーザースクロール何か後にべたつく除いて正常に動作している(75ワード件まで言います)。これをどうすれば factor (-100 , -220)など動的にするのですか?

答えて

0

計算するscrollHeightあなたの場合の要素のように振る舞います。ここでは計算方法を示します。

var scrollHeight = window.innerHeight * (window.innerHeight/document.body.offsetHeight); 

ブラウザの動作が少し異なります。 100scrollHeightで置き換えます。ウィルは働くかもしれない。

関連する問題