Плавный offset jquery

Question

Допустим есть элемент с классом .elem1

Есть второй элемент с классом .elem2

Как плавно сделать offset() второго элемента (.elem2) к элементу (.elem1). Чтоб достигался эффект наложения друг на друга.

Если делать так

var d = $('.elem1').offset();
$('.elem2').offset({top:d.top,left:d.left});

То это срабатывает быстро (рывком). Как сделать это плавно ? animate() сдвигает до первой границы элемента .elem1.

Answer 1

let elY1 = $('.elem1').offset().top + $('.elem1').height();

$('.elem2').animate({
  top: elY1
}, 1000, 'linear');

.elem1,
.elem2 {
  display: block;
  width: 100px;
  height: 50px;
  position: absolute;
}

.elem1 {
  background: red;
  top: 50px;
}

.elem2 {
  background: blue;
  top: 200px;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="elem1"></div>
<div class="elem2"></div>

БЛОГ НА HUSL

Плавный offset jquery

Ответы (1 шт):