jQuery - вырастите div от центра до анимации в

Question

Хорошо, у меня есть эти divs, которые я анимировал в/из ранее, делая hide() или show(), однако это не выглядит чистым, и Id нравится им вырасти из центра, т.е. растут от ширины ничто до их текущей ширины.

Я новичок в анимации jquery и не знаю, как это сделать должным образом. Я попытался установить начальную ширину на 0 и делать:

function panelIn(labDiv) { 
    var neww = "700px"; 
    $(labDiv).animate({ 
    width: neww 
    }, 2000); 
} 

Но это растёт вправо справа. Как я могу это достичь? Есть ли хорошие, библиотеки для анимации в div, т. Е. Их представления на странице?

Answer 1

В зависимости от того, что вы делаете, вы можете просто использовать CSS и .toggleClass().

CSS

#labDiv{ 
    height:700px; 
    width:700px; 
    transform:scale(0); 
    transform-origin:center center; 
    transition: transform 2000ms ease; 
} 

#labDiv.show{ 
    transform:scale(1); 
} 

JQuery

function panelIn(labDiv){ 
    labDiv.toggleClass('show'); 
}