中文前端UI架構Kit（十一）搖頭動畫？讓你的頁面元素嗑藥嗑起來？？

號外：kitjs官方討論QQ群建立了，QQ群號88093625，歡迎大家加入，討論前端相關話題

demo地址：http://xueduany.github.com/KitJs/KitJs/index.html#shakehead

發現沒有晃動效果的同學記得清下緩衝，因為kit.anim對象的js檔案有更新，3Q3Q

 

今天聽群裡面兄弟在討論一個搖頭的動畫效果，類似登陸驗證時候，視窗晃動的效果，結合之前說過的kitjs的anim類，我們可以很輕鬆的實作類別似的組件晃動效果

代碼如下：

function a1() {
                    $kit.anim.motion({
                        duration : 1000,//期間
                        el : "#test1",
                        fx : $kit.anim.fx('swing'),
                        from : {
                            'margin-left' : '50px'
                        },
                        to : {
                            'margin-left' : '0px'
                        },
                        reverse: true,
                        timeSeg: 33,//晃動頻率，自己調
                        then : function() {
                            $kit.log('搖動完畢？再shake一次？')
                        }
                    });
                }

對於kit.anim.motion方法新增了一個config.reverse參數，控制在動畫期間實現正反值的控制

 

 

效果不錯，有興趣的童鞋可以試試

 

有更多需求或者建議，歡迎加群討論^_^