transformjs/example/soft2.html

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<img  src="../asset/alloy.png" id="test" style="display: block; width: 210px;height: 210px;position: absolute;left: 50%;margin-left: -105px;margin-top: -105px;top:50%;">
<a href="https://github.com/AlloyTeam/AlloyTouch/tree/master/transformjs" target="_blank" style="position: absolute; right: 0; top: 0;">
    <img src="//alloyteam.github.io/github.png" alt="" />
</a>

<script src="../transform.js" ></script>
<script src="../asset/createjs.tween.js"></script>

<script>


        var element = document.querySelector("#test");
        Transform(element);
        element.originY = 100;
        element.skewX = -20;

        var Tween = createjs.Tween,
                sineInOutEase = createjs.Ease.sineInOut;
        Tween.get(element, {loop: true}).to({scaleY: .8}, 450, sineInOutEase).to({scaleY: 1}, 450, sineInOutEase);
        Tween.get(element, {loop: true}).to({skewX: 20}, 900, sineInOutEase).to({skewX: -20}, 900, sineInOutEase);

</script>
</body>
</html>