rstacruz / jquery.transit

Super-smooth CSS3 transformations and transitions for jQuery
http://ricostacruz.com/jquery.transit
7.29k stars 863 forks source link

No absolute move with x and y #156

Open mikaelho opened 11 years ago

mikaelho commented 11 years ago

Documentation at http://ricostacruz.com/jquery.transit/ indicates that there is a difference between using and not using '+=' with x and y in the transition. In practice there does not seem to be any way to do an absolute move with x and y.

Test cases:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <script type="text/javascript" src="../lib/jquery-2.0.3.min.js"></script>
    <script type="text/javascript" src="../lib/jquery.transit.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            // These are all relative
            $("#test").transition({ x: 40, y: 40 }, 1000, 'linear');
            //$("#test").transition({ x: '40px', y: '40px' }, 1000, 'linear');
            //$("#test").transition({ x: '+=40px', y: '+=40px' }, 1000, 'linear');

            // These are absolute
            //$("#test").transition({ left: 40, top: 40 }, 1000, 'linear');
            //$("#test").transition({ left: '40px', top: '40px' }, 1000, 'linear');

            // This is relative
            //$("#test").transition({ left: '+=40px', top: '+=40px' }, 1000, 'linear');
        });
    </script>
</head>
<body>
    <div id="test" 
        style="position: absolute; top: 100px; left: 100px; width: 30px; height: 30px; background-color: #00ff00"></div>
</body>
</html>