Как оживить эту функцию JavaScript?

Question

У меня есть функция, которая делает это, если я нажимаю на блок div с именем "bokse1", поле в другом поле с именем "Whole" будет удалено, в данном случае, на 50px. Я хочу оживить удаление маржи.

вот функция:

     $(function() {
   $('#bokse1').click(function() {
     $('#Whole').css('margin-left', '-=50px');
   });
   });

Мне бы хотелось, чтобы анимация была линейной, и так, скажем, на 1 секунду.

Вот скрипка: http://jsfiddle.net/1cybw0ez/

Answer 1

Вы можете использовать .animate () вместо .css ()

$( "#clickme" ).click(function() {
  $( "#book" ).animate({
    opacity: 0.25,
    left: "+=50",
    height: "toggle"
  }, 5000, function() {
    // Animation complete.
  });
});

Подробнее об этом можно прочитать здесь

Answer 2

Также вы можете использовать css's для настройки анимации с помощью css