WindowBlinds主题动画开始按钮制作教程
Nov 24 , 2008 • 理论教程 • 4 Comments
WB主题很多元素的悬浮状态都支持动画效果（也就是鼠标悬浮后从普通状态动画过渡到鼠标悬浮状态），而且设置方法也差不多，所以这里就以动画的开始按钮为例写个简单教程。
默认的开始按钮图总共有5帧内容，解释一下各帧的用途：
第一帧是普通状态，也就是鼠标没有悬浮时的开始按钮
第二帧是开始按钮按下，也就是开始菜单弹出之后的图片
第三帧没有用，留白即可
第四帧是鼠标悬浮状态
第五帧同样没用，也留白
如果要增加动画效果，需要在原先的图片上增加逐帧动画的图片，这个例子是想要从上下盖子盖住start字样的第一帧开始，盖子一点点向上下移动直到收起，非常简单的一个5帧的动画（实际上帧数多少没有限制，如果需要的话，我们可以任意添加），把后面这5帧内容依次排列在原先那5帧之后：
图片导入之后首先要做的是设置一下这个图片总共有多少帧：
然后我们跳转到开始按钮的Animation选项页进行详细的设置：
只要拖动过动画速度那个slider，有数值那动画就开启了，同时原来第四帧那个图片也不再发挥作用。
而点击那个Try it按钮可以在新开的窗口里测试动画。
需要注意的是上面这个对话框里设置的帧数都是针对整个图片而言的，比如我刚才那个例子动画起始帧就要设置成6，而结束帧是10
默认的开始按钮图总共有5帧内容，解释一下各帧的用途：
第一帧是普通状态，也就是鼠标没有悬浮时的开始按钮
第二帧是开始按钮按下，也就是开始菜单弹出之后的图片
第三帧没有用，留白即可
第四帧是鼠标悬浮状态
第五帧同样没用，也留白
如果要增加动画效果，需要在原先的图片上增加逐帧动画的图片，这个例子是想要从上下盖子盖住start字样的第一帧开始，盖子一点点向上下移动直到收起，非常简单的一个5帧的动画（实际上帧数多少没有限制，如果需要的话，我们可以任意添加），把后面这5帧内容依次排列在原先那5帧之后：
图片导入之后首先要做的是设置一下这个图片总共有多少帧：
然后我们跳转到开始按钮的Animation选项页进行详细的设置：
只要拖动过动画速度那个slider，有数值那动画就开启了，同时原来第四帧那个图片也不再发挥作用。
而点击那个Try it按钮可以在新开的窗口里测试动画。
需要注意的是上面这个对话框里设置的帧数都是针对整个图片而言的，比如我刚才那个例子动画起始帧就要设置成6，而结束帧是10
Share it!
http://i41.tinypic.com/jskcar.png
顺便问下 您能给个WB 的下载地址吗?
我下载的WB 用您的ZING!主题 显示不出来右边活动工具栏内容