简单CSS3技巧实现的Logo动画
简单CSS3技巧实现的Logo动画，就是鼠标浮上去，切换图片，为了满足广大用户的需求，这里就简单做个演示。东西相对较简单，所以不要认为你搞不定它。
操作方法
- 01
下面是演示的案例代码 <style>.imlogo{ display: block; width: 160px; height: 80px; background: #FF5E52 url(http://exp.bdstatic.com/static/common/widget/top-search-box/logo_1e63520.png) center 22px no-repeat; -webkit-transition: background-position linear .2s; -moz-transition: background-position linear .2s; transition: background-position linear .2s;}.imlogo:hover{ background-position: center -48px;}</style><a class="imlogo" href="#"></a> 其实你只需要改变其中的图片地址、Logo区域大小（160px和80px）背景图的坐标（22px和-48px），你就能实现自己的动画了，如果你很懒，那就做个119*100px的logo即可，像下面这样的一张图（背景做成透明的，png格式，即可实现代码改变颜色）。
- 02
xiu主题用户动态Logo专用方案： .logo a{ -webkit-transition: background-position linear .2s; -moz-transition: background-position linear .2s; transition: background-position linear .2s;}.logo a:hover{ background-position: center -48px;} 在主题的style.css最后加上，再做个原来Logo高度2倍的图先替换，然后更改其中的-48为你的位置即可，不会计算的话直接多试几个就能知道哪个合适了。
相关推荐
-
几个简单的技巧,解决会声会影渲染过慢的问题
会声会影软件是一款常用的家庭和个人视频编辑软件，它具有强大的专业功能，可以媲美很多的专业视频编辑软件。视频的渲染在会声会影的使用过程中是十分重要的一个环节，很多人在渲染视频的时候速度可能会很缓慢，下面 ...
-
几个Excel中简单重复技巧分享
别小看简单的重复,在Excel中,一个简单的重复动作或操作,能够变换出神奇的数据或数据效果.今天小编为大家分享几个Excel中简单重复技巧,有兴趣的朋友可以参考本文,希望大家喜欢! 1. Ctrl+E ...
-
如何快速创作一个logo动画？（0成本）
Logo动画是企业视频不可缺少的一部分,想要做一个专属的logo动画,成本非常高.这一期我来教大家如何快速免费来制作一个品牌的logo动画. 开始进行制作 01 预览完成后,点击[开始制作],更换lo ...
-
flash最简单的元件跟随鼠标的动画
lash动画中,有一类经典的动画,就是元件跟随鼠标的动画,一提到这类动画,大家都知道,效果相当可观,所以很多人可能会认为,这种动画很难制作! 其实不然,这种动画很简单,因为和普通的动画没啥区别,仅需要 ...
-
AE视频特效软件如何制作文字LOGO动画效果
AE是被人称为是动态的photoshop,所以AE也是有图层的. AE的关键帧非常重要,我们这节课讲解下认识AE的关键帧,并制作文字LOGO动画效果 操作方法 01 新建合成 02 每个图层的旁边都会 ...
-
AE制作超炫LOGO动画
第1步:在Illustrator里绘制图形 打开Illustrator,画布大小设置为800X600px大校创建出一个图形,这里我用的是Bridge的Logo,你也可以使用自己喜欢的图形,然后新建一个 ...
-
教你简单的技巧,快速完成Excel操作
教你简单的技巧,快速完成Excel操作
-
ae简单特效教程（ae制作动画教程）
效果图为什么我们要用插件,因为插件可以增加我们效率,就像我们这篇文章如果不用插件的话,应该也可以,虽然我不会,但是会非常非常的复杂(每天5分钟,充实一整天)教程1.首先打开我们的AE2.新建一个合成, ...
-
Excel简单操作技巧，比别人更快完成工作
在Excel中有很多技巧,别人用4秒搞定一个事,你可能需要花5分钟去完成.今天给大家分享几个简单技巧,快速提高你的效率. 操作方法 01 快速筛选 选中要筛选的单元格,右键点击筛选-按所选单元格筛选, ...
