クイックサンドアニメーションの終わりに突然の置換

Question

htmlテンプレートを購入しました。クイックサンドプラグインの実装に問題があります。

クイックサンドを使用してコンテンツを変更すると、最後に問題があります。写真は他の場所に浮かんでいますが、最終的には非常に厳しい突然の方法で正しい出力写真に変更されます。

私はhtmlコードを変更しただけなので、.jsファイルには何もありません。 ここに問題が表示されます：http://marcknoll.com/work.html フィルタをクリックすると、意味を理解できます。

誰でもこの問題の原因を知ることはできますか？前もって感謝します！

乾杯は、 マルク・

Answer 1

これを注意してください。 list要素では、li要素のdata-idが14番目のli以降に繰り返されます。 id-1から再び始まります。

<li data-id="id-1" class="photo"> 
    <a href="http://marcknoll.com/images/preview/canals.jpg" rel="image_group"> 
     <img src="work_files/work_1.jpg" alt="Work Image"> 
    </a> 
</li> 
<li data-id="id-2" class="photo"> 
    <a href="http://marcknoll.com/images/preview/bikes.jpg" rel="image_group"> 
     <img src="work_files/work_2.jpg" alt="Work Image"> 
    </a> 
</li> 
<li data-id="id-3" class="photo"> 
    <a href="http://marcknoll.com/images/preview/fountain.jpg" rel="image_group"> 
     <img src="work_files/work_3.jpg" alt="Work Image"> 
    </a> 
</li> 
.......... 
.......... 
.......... 
.......... 
.......... 
<li data-id="id-14" class="photo"> 
    <a href="http://marcknoll.com/images/preview/water1.jpg" rel="image_group"> 
    <img src="work_files/work_12.jpg" alt="Work Image"> 
    </a> 
</li> 
<li data-id="id-1" class="photo"> // data-id repeating 
    <a href="http://marcknoll.com/images/preview/sony.jpg" rel="image_group"> 
    <img src="work_files/work_13.jpg" alt="Work Image"> 
    </a> 
</li> 

プラグインのクイックサンドを動作させるには、data-idをliごとに一意にする必要があります。これは私が気づいた最初の問題です。

編集：

が確認されました。それが問題です。 Iは、データIDを与えID-1、ID-2、ID-3、ID-4、ID-5 .. ID-47、ID-48、現在そのうまく動作します。