Анимации jQuery ведут себя неправильно в Chrome / Safari, когда пользователь увеличивает или уменьшает масштаб - PullRequest
Новая
       47

Анимации jQuery ведут себя неправильно в Chrome / Safari, когда пользователь увеличивает или уменьшает масштаб

2 голосов
/ 23 ноября 2010

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

В примере, который я создал, банкнота в 100 долларов движется под прозрачной .png бумагой с вырванным отверстием. Оба элемента настроены с абсолютным позиционированием, и бумага .png имеет более высокий z-индекс.

Казалось, все работает нормально, но в Chrome и Safari я заметил, что увеличение или уменьшение масштаба нарушает позиционирование.

Я разместил пример здесь:

http://tdm -analytics.com / JS / примеры / пример-1.html

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

Код здесь: 

<!DOCTYPE html>
<head>
    <script type="text/javascript" src="http://tdm-analytics.com/js/examples/jquery-1.4.4.js"></script>
    <script>
        $(document).ready(function() {
            $("#100").animate({"top":"-=610px"}, 3000);
        });
    </script>
</head>
<body>
    <div id="envelope" style="position:absolute;margin-right:-195px;right:50%;top:200px;z-index:9999;">
        <img src="http://tdm-analytics.com/js/examples/bkhtornframe.png" />
    </div>
    <div id="100" style="position:absolute;margin-right:-190px;right:50%;top:630px;z-index:1;">
        <img src="http://tdm-analytics.com/js/examples/100-dollar-bill.jpg" />
    </div>
</body>
</html>

Не уверен, что это я что-то не так сделал или проблема с jQuery. Если кто-нибудь знает исправление, я был бы очень признателен за помощь.

Ответы [ 2 ]

1 голос
/ 01 мая 2012

Используйте поля, например margin_left для анимации по горизонтали, что работает при увеличении Chrome / Safari [и других].

0 голосов
/ 29 декабря 2010

Я не вижу проблем с анимацией в Chrome. Не пробовал Safari, потому что это веб-кит так же хорошо, как Chrome.

Или вы ссылаетесь на полосу прокрутки браузера, которая появляется при разрешении экрана Certail при увеличении?

...