グリッドリストのmdグリッドタイルに割り当てられた位置を計算する方法

Question

私はフルページスクロールを使用しており、すべてのページに固定要素を持っています。一度スクロールして空のグリッドタイルの位置を取る必要があります。ページ。 * num_colの-1）

-

グリッドのタイルの位置は、この式

CALC（uncnown PX）+1（100/NUM_COLS％）を用いて計算されたようです

私はこの方程式の未知の部分は何か分かりませんが、例えばこの3列レイアウトでは、2を3で割ったもの（num_cols）に等しい0.66667を出します。

誰かが簡単な方法を知っていますか、または未知の式の意味は何ですか？

Answer 1

私が理解しているように、左から3番目のdivのオフセットを計算する必要があります。

$(document).on('click', 'button', function() { 
 
    $('.left-value').text($('.row .col:nth-child(3)').offset().left); 
 
});

* { 
 
    box-sizing: border-box; 
 
    ; 
 
    margin: 0; 
 
} 
 

 
.row {} 
 

 
.col { 
 
    height: 60px; 
 
    width: 31.33333%; 
 
    border: 1px solid #000; 
 
    margin: 1%; 
 
    display: inline-block; 
 
    float: left; 
 
} 
 

 
.row:before, 
 
.row:after { 
 
    content: ""; 
 
    display: table 
 
} 
 

 
.row:after { 
 
    clear: both; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="row"> 
 
    <div class="col"></div> 
 
    <div class="col"></div> 
 
    <div class="col"></div> 
 
    <div class="col"></div> 
 
    <div class="col"></div> 
 
    <div class="col"></div> 
 
</div> 
 
<br> 
 
<button>Calculate</button><br> margin form left od 3rd div: <span class="left-value"></span>

：以下のスニペットをチェック