Как плагин kinetic перемещается контент внутри себя?

174

02 мая 2019, 12:40

Всем привет.

Есть вот такой плагин: jquery.kinetic

Изучаю его принцип работы и внутренности. Но не могу понять какие свойства он меняет чтобы изменить позиционирование элемента.

отрицательный left не использует. margin тоже.

Ну по крайней мере chrome devtools это не отображает

Answer 1

Данный плагин использует scrollLeft и scrollTop контейнера .wrapper

Узнать это можно в исходниках в функции _inputmove, а также если убрать у контейнера свойство overflow: hidden;

$('.wrapper').kinetic();

.wrapper { 
  border: solid 5px #000; 
  height: 400px; 
  width: 400px; 
  overflow: scroll; 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<script src="https://cdn.jsdelivr.net/npm/jquery.kinetic/jquery.kinetic.js"></script> 
 
<div class="wrapper"> 
  <div id="inner"> 
    <img src="https://davetayls.me/jquery.kinetic/lib/wembley.jpg" alt="wembley stadium" kasperskylab_antibanner="on"> 
  </div> 
</div>