Есть ли способ добавить анимацию в "inserBefore"? У меня есть странное деловое требование, чтобы вкладка в навигации перемещалась из последней позиции справа, в первую позицию слева.
Бизнес хочет, чтобы это было очевидно, когда это происходит, и хотите перемещаться по анимированному пути.
Таким образом, упрощенный пример:
Скажите, что это проблема с навигацией.
<ul id="test">
<li>First Item</li>
<li>Second Item</li>
<li>Third Item</li>
<li>Fourth Item</li>
<li>LAST Item</li>
</ul>
Можно ли анимировать поведение ниже?
$("li:last").insertBefore("li:first");
Ответ 1
Вы можете сделать это следующим образом:
$("li:last").slideUp(function() {
$(this).insertBefore("li:first").slideDown();
});
Вы можете протестировать его здесь, они должны сделать .insertBefore() после завершения анимации, выполнив ее в обратном вызове. Это один из нескольких вариантов анимации, например, вы можете использовать любой из эффектов здесь (вам нужно будет включить JQuery UI для них).
Ответ 2
Попробуйте это, посмотрите, можете ли вы отредактировать анимацию, чтобы сделать то, что хотите.
$('li:last')
.animate({height:'toggle'},200)
.insertBefore('li:first')
.animate({height:'toggle'},200);
