写在前面

记得以前facebook做过一款HTML5游戏。开场动画是一块软体类似豆腐的东西一起摇摆。类似的效果如下面的gif所示：
Android培训,安卓培训,手机开发培训,移动开发培训,云培训培训

facebook当时使用的是createjs下的子项目easeljs和tweenjs去制作，基于Canvas的动画。基本的原理主要是：循环运动Canvas抽象的DisplayObject的skewX和scaleY来实现软体摇摆。
目前来看transformjs也能做到，因为transformjs也能运动skewX和scaleY。先来看看facebook的方式。

tweenjs + transformjs

注意这里的tweenjs是createjs下的子项目，而不是github上的tween.js项目。 

var element = document.querySelector("#test"); Transform(element); element.originY = 100; element.skewX = -20; var Tween = createjs.Tween, sineInOutEase =<
        
		

        		
网友评论

     		
				

			
			
			
		
		

		
    	
    	
        	

        		
更多精彩分享

        		
    
        			
        		

        			
	        		
	        		学习是年轻人改变自己的最好方式-Java培训机构,青岛Java培训,青岛计算机培训,软件编程培训,seo优化培训,网络推广培训,网络营销培训,SEM培训,网络优化,在线营销培训,Java培训学习是年轻人改变自己的最好方式