Анимация jQuery плавная в Firefox и Chrome, но не в Safari 5 - PullRequest
Новая
       43

Анимация jQuery плавная в Firefox и Chrome, но не в Safari 5

0 голосов
/ 07 апреля 2011 
<!DOCTYPE html> 
<html>
    <head>
        <style>
            .divs
            {
                width:900px;
                height:599px;
                border:solid 1px gray; 
                position:absolute;
                top:0px;
                left:0px;
            }
            #div_1
            {
                background:#fff url('../photos/home/Jun112010_5456.jpg') top left no-repeat;
            }
            #div_2
            {
                background:#fff url('../photos/home/_FRI2911.jpg') top left no-repeat;
            }
        </style>
    </head>
    <body>
        <div id="div_2" class="divs"></div>
        <div id="div_1" class="divs"></div>
    </body>
    <script language="JavaScript" src="../../site/c_side/jquery.js"></script>
    <script language="JavaScript">
        $(function(){
            $("#div_1")
                .animate({
                    opacity : 0.0
                }, 1000 , function(){
                    $("#div_2").animate({
                        opacity : 0.0
                    }, 1000 )
                })
        });
    </script>
</html>

Анимация непрозрачности плавно воспроизводится в Firefox и Chrome, но не в Safari 5?Почему так? Заранее благодарен за помощь.

Ответы [ 2 ]

0 голосов
/ 07 апреля 2011

Нет необходимости использовать значения с плавающей запятой для непрозрачности, в Safari 5 на Mac это выглядит довольно плавно, я раскрасил ваши прямоугольники для демонстрации, посмотрите: http://jsfiddle.net/Gkfzd/1/. Надеюсь, это поможет!

0 голосов
/ 07 апреля 2011

Не знаю почему, но вы можете попробовать этот плагин jQuery , который пытается использовать встроенную в браузер (CSS3) анимацию для определенных переходов (включая непрозрачность).

...