多语言展示
当前在线:780今日阅读:31今日分享:25

css3动画,图标图片动态

怎么使用css3制作图片动态效果呢,鼠标移动上去就有效果;需要时可搭配jq
工具/原料
1

电脑

2

编辑器

方法/步骤
1

html端代码

2

定位图标,(常态禁用动画,鼠标经过激活动画)

3

定义转动样式,顺时针和逆时针

4

通过hover事件给与经过转动

5

动画样式写法

6

其实这种写法禁用之后hover没有,得在jq写经过给与样式;

纯css的话
1

就是hover事件才给与动画样式,没有定死样式再给用jq给样式;纯css的话每个li里面的效果都得单独进行hover控制,多个效果的话样式会多,css和jq结合会代码会少点;

2

当然你也可以使用加类的方法,jq加类;定义样式类动画事件,jq鼠标经过就加这个动画类,这样的话就可以开始禁止,写法上更佳符合,

3

加类的方法的好处是不会禁用到其他你想要的效果;只是经过才会,保证了效果的完整性,写法符合,纯css的话代码多,需自己整合区分

注意事项
1

方法有很多,看你需要去布局,都不是绝对的

2

喜欢有用投票吧,欢迎一起讨论,研究css动画

推荐信息