利用jQuery创建一个类似Skype上应用的按钮特效
如果使用Skype的人,大家都会注意到它的动画按钮。当您点击它的图标时,在左边“跳跃一下”或者图标在滚动。
演示:
例子1 :http://blog.moocss.com/jQuery/demo2/SkypeButton1.html
例子2 :http://blog.moocss.com/jQuery/demo2/SkypeButton2.html
关键代码;
jQuery Code :
1 2 3 4 5 6 7 8 9 | $(document).ready(function(){ $(".button").hover(function(){ $(".button img") .animate({top:"-10px"}, 200).animate({top:"-4px"}, 200) // first jump .animate({top:"-7px"}, 100).animate({top:"-4px"}, 100) // second jump .animate({top:"-6px"}, 100).animate({top:"-4px"}, 100); // the last jump }); }); |
文章评论 已经有 0 条评论!