Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Не правильное время анимации и область div'а (https://javascript.ru/forum/jquery/21935-ne-pravilnoe-vremya-animacii-i-oblast-div%27.html)

BoB 29.09.2011 21:56

Не правильное время анимации и область div'а
 
Добрый вечер.

Решил сделать страничку-визитку на JS используя jQuery, но при создании возникли некоторые проблемы.
  1. Выставляю время на анимацию 5секунд
    $("#tack_portfolio").animate({"top": "+=400px"}, "4000", 'easeInBack');
    
    , а она проходит за секунды, а то и меньше.
  2. Область при нажатии на фотографии определяется не правильно, я догадываюсь что это из-за моей корявой верстки, но из-за чего именно, не могу понять.

Собственно сама страничка http://moto-sale.net/lampo4ka/3/

Буду благодарен за любые советы

melky 29.09.2011 22:04

Цитата:

Сообщение от BoB (Сообщение 128788)
Выставляю время на анимацию 5секунд
$("#tack_portfolio").animate({"top": "+=400px"}, *!*"4000"*/!*, 'easeInBack');
, а она проходит за секунды, а то и меньше.

взаимоисключающие параграфы

у вас в коде это
$("#tack_portfolio").animate({"top": "+=400px"}, "4000", 'easeInBack');
    $("#tack_portfolio").hide(0);

поставьте скрытие в обработчик завершения анимации.

BoB 29.09.2011 22:12

Цитата:

Сообщение от melky (Сообщение 128791)
взаимоисключающие параграфы

у вас в коде это
$("#tack_portfolio").animate({"top": "+=400px"}, "4000", 'easeInBack');
    $("#tack_portfolio").hide(0);

поставьте скрытие в обработчик завершения анимации.

Опечатался конечно, за 4 секунды, но и 4 секунд не проходит. Скрытие поставил на место.

zebra 29.09.2011 22:20

Вы скрываете див, до того как прошла анимация.
$("#tack_portfolio").animate({"top": "+=400px"}, "4000", function() {
   $("#tack_portfolio").hide(0);
});

BoB 29.09.2011 22:28

Цитата:

Сообщение от zebra (Сообщение 128796)
Вы скрываете див, до того как прошла анимация.
$("#tack_portfolio").animate({"top": "+=400px"}, "4000", function() {
   $("#tack_portfolio").hide(0);
});

А в документации написано по другому
Код:

.animate( properties, [duration,] [easing,] [complete] )

properties A map of CSS properties that the animation will move toward.

duration A string or number determining how long the animation will run.

easing A string indicating which easing function to use for the transition.

complete A function to call once the animation is complete.


zebra 29.09.2011 22:34

По другому это как? :)

BoB 29.09.2011 22:41

Цитата:

Сообщение от zebra (Сообщение 128800)
По другому это как? :)

complete A function to call once the animation is complete.
(Функция вызываемая по окончанию анимации)

melky 29.09.2011 22:42

он сказал вам, в чем ваша ошибка, и написал правильный код.

не так поняли.

BoB 29.09.2011 23:00

Цитата:

Сообщение от melky (Сообщение 128805)
он сказал вам, в чем ваша ошибка, и написал правильный код.

не так поняли.

Не могли бы вы подробнее объяснить в чем ошибка.

Отличие которое я заметил только в удалении типа анимации(easing) и указания вместо элемента (this), ("#tack_portfolio").

zebra 29.09.2011 23:10

Цитата:

Сообщение от BoB
$("#tack_portfolio").animate({"top": "+=400px"}, "4000", 'easeInBack');
$("#tack_portfolio").hide(0);

Cкрипт не будет ждать 4 секунды до завершения анимации, а пойдет просто дальше и вызовет hide. Для того, чтобы знать когда завершится анимация и нужна callback функция


Часовой пояс GMT +3, время: 20:05.