Как поменять свойство css на auto, медленно с помощью jQuery?

Question

Как поменять свойство css на auto, медленно с помощью jQuery?

0

У меня есть элемент, установленный как position:fixed и bottom: auto; и в какой-то момент я делаю .animate({bottom: '10%'}); он плавно скользит, а затем я хочу вернуть его авто.

Если я делаю .css('bottom','auto'); он скользит, но не медленно. Таким образом, он мгновенно переходит в исходное положение.

Я не могу использовать .animate(); так как я могу это сделать?

один способ может использовать .toggleClass(); , но нет ли способа без изменения его класса?

Я также попытался установить длительное -webkit-transition, но он все же мгновенно переходит в исходное положение.

И другое решение могло бы состоять в том, чтобы сохранить начальную позицию в переменной и поместить ее туда, но она не работает для меня, потому что исходная позиция может или не может измениться в этой функции.

jeff 29 сен. 2013, в 12:45

Источник

Теги:

javascript

jquery

html

css

jquery-ui

4 ответа

Ещё вопросы

mitchfuku · Answer 1 · 2013-09-29T08-06-00.000Z

Вы не можете медленно устанавливать что-то в auto в CSS, потому что, как только оно становится автоматическим, вычисления фактически присваивают значение auto значению. Так как вы все это делаете в JS, не можете ли вы выполнить вычисления и установить нижнее значение?

Rafi · Answer 2 · 2014-05-21T12-34-00.000Z

Проверьте эту ссылку http://api.jquery.com/animate/

 $('#uiAdminPanelMenu li a').hover( function(){
 $(this).animate({'background-color': '#D3E1FA'}, 'slow');
 },
 function(){
 $(this).animate({'background-color': '#F4F4F4'}, 'slow');
 });

Paul Rad · Answer 3 · 2013-09-29T07-40-00.000Z

Как это?

http://jsfiddle.net/a8tQ2/

$('#scr').animate({
    bottom: '10%'
}, 1000, function() {
 $(this).css('bottom', 'auto');
});

Yair Nevet · Answer 4 · 2013-09-29T09-24-00.000Z

Вы можете сделать это в CSS 3 с помощью поддержки переходов: http://css3.bradshawenterprises.com/

Например:

div
{
 transition: width 1s linear 2s;
 /* Safari */
 -webkit-transition:width 1s linear 2s;
}

Я тоже попробовал это. Но, может быть, так: могу ли я перевести (0, в определенную позицию); ?