почему моя анимация JQuery не работает должным образом в Chrome при использовании браузера подтверждения и предупреждения? - PullRequest
0 голосов
/ 29 сентября 2011

Я вижу проблему, связанную с анимацией jquery в chrome. Мне интересно, видел ли кто-нибудь еще это.

Я просто пытаюсь сделать несколько простых слайдов, чтобы скрыть div или скрыть, а затем добавить div. Анимация слайда вверх в div не происходит в Chrome, а шкура отстает до того, как исчезает; тогда как в Firefox анимация мгновенная и плавная.

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

Это странно?

Вот пример. С подтверждением я не получаю скольжения вверх. Без подтверждения я получаю один. То есть просто удаляем блок кода if (verify) {}.

   if (confirm('Are you sure you want to remove the item?')) {
        dragbox.slideUp('fast', function () {
            dragbox.remove();
            WebService.RemoveItem(itemId,
            //on success
                function () {
                    if ($('.dragbox').length == 0) {
                        //remove columns
                        $('.column').remove();
                    }
                },
            //on fail
                function () {
                    alert('Failed to remove the "' + itemName + '" item.');
                }
            );
        });
    }

В этом примере с подтверждением есть задержка после того, как div скрыт, и до начала исчезновения, так что div скрыт дольше, чем мне бы хотелось. Без подтверждения ti ведет себя так, как я ожидал.

        if (confirm('Are you sure?')) {
            $('#' + itemId).spin();
            WebService.AddItem(itemId,
            //onsuccess
                function (r) {
                    var item = $('#' + itemId); //this is a div
                    item.unspin();

                    item
                        .hide()
                        .toggleClass('item-added')
                        .fadeIn('fast', function () {
                            // Create the DOM elements
                            $('<p><img class="item-added" src="images/item-added.png" />')
                            // Sets the style of the elements to "display:none"
                            .hide()
                                // Appends the hidden elements to the "posts" element
                            .appendTo($('.contentInfo', item))
                                // Fades the new content into view
                            .fadeIn('fast');
                        });

                },
            //onfail
                function () {
                    $('#' + itemId).unspin();
                    alert('Failed');
                }
            );
        }

Может ли кто-нибудь подтвердить или опровергнуть это понятие на основании моих предположений и примера? Какие альтернативы браузеру подтверждают?

РЕДАКТИРОВАТЬ: Да, я не уверен, что происходит.

Ответы [ 3 ]

0 голосов
/ 16 ноября 2011

Обновление Chrome исправляет это. У меня сейчас работает версия 15.0.874.120 и все хорошо. Мое слово.

0 голосов
/ 30 марта 2013

Я просто испытывал то же самое с некоторым кодом, который работал, когда он был написан пару лет назад. Теперь у него есть проблемы в браузерах на основе webkit.

У меня было несколько анимаций, которые были приостановлены с помощью вызовов verify (), и последующие анимации не отображались должным образом. Наконец-то я понял, что если я поставлю небольшую задержку перед анимацией, она начнет работать правильно.

  if (confirm('Are you sure?')) {
    dragbox.delay(10).slideUp('fast', function () { ...

Я не совсем уверен, почему это работает, но мои анимации теперь снова работают в Safari 6.0.3 и Chrome 26.0.1410.43

0 голосов
/ 29 сентября 2011

Используете ли вы новейшую версию jQuery UI? У вас также есть таблица стилей jQuery UI? Все выглядит хорошо. Если вы не можете найти ответ здесь, откройте сообщение об ошибке.

...