JQuery .addClass () сразу после .append () не работает должным образом - PullRequest
Новая
       7

JQuery .addClass () сразу после .append () не работает должным образом

0 голосов
/ 21 ноября 2018

HTML 

<ul class="container" >
   <li class="default-state"> 
      some stuff 
   </li>
</ul>

SASS 

.default-state
  transition: all 0.2s ease 0s
  width: 20px

.new-state
  width: 100px

JS 

$itemClone = $('li.default-state').clone();
$('ul').append($itemClone);
$itemClone.addClass('new-state');

Происходит следующее: div появляется в списке с его классом уже как '.new-state ', и никакой переход не применяется.

Что я нахожу абсурдным, когда я делаю это: 

$itemClone = $('li.default-state').clone();
$('ul.container').append($itemClone);
setTimeout(function(){
   $itemClone.addClass('new-state');
}, 1);

Это работает отлично.Но я чувствую, что использование .delay () или setTimeout в этом сценарии не требуется.Я знаю. append() не имеет функции обратного вызова, есть ли другой метод jquery, который я мог бы добавить к этому, чтобы избежать добавления глупых задержек в 1 мс?

Я хочу сохранить все свои переходы / анимации в SASS, потому что ширины являются динамическими в медиа-запросах.

...