在我以前的认知里，background-image是不能有动画或过渡效果的，但是，今天发现并不是这样的，CSS animation动画和transition过渡都可以触发A背景图到B背景图淡入淡出效果。
文章关键字 ‘transition’
颠覆，原来background-image也是支持CSS动画的
2020年08月6日，星期四微信网页悬浮窗交互效果的web实现
2018年06月6日，星期三微信更新后，发现多了个悬浮窗功能。公众号阅读，网页浏览回退后默认会出现。再点击，可以回到刚才阅读的地方。于是，再也不会遇到回复老婆的信息，再切换回来重新找刚才阅读东西的麻烦了。我个人觉得是很有用的一个功能。
其交互效果，也被不少人称赞。例如，窗口会收缩到悬浮按钮中，悬浮按钮可以拖到右下角取消浮窗。这些交互效果呢，使用web前端技术也是可以实现，有demo，有截图，有必要的源代码展示，希望本文的内容能够对您的学习有所帮助。
几种CSS渐变背景图片transtion动画方法
2018年03月25日，星期日background-image不支持CSS3 transition，因此，当CSS3 gradient渐变作为背景图片存在的时候，直接设置transition是不会有过渡效果的，那该怎么办呢？
CSS镂空图片transition过渡初加载背景色块问题解决
2016年02月25日，星期四CSS镂空图片，由于颜色是CSS属性值控制，如color或者background-color, 因此可以实现transition过渡效果，同时节约资源。然而有个很严重的问题，就是加载时候，容易出现色块，而本文就将展示如何解决色块的问题，让好的技术更加适用！
有demo有截图有必要的源代码展示，希望本文的内容可以对您的学习有所帮助！
CSS3 clip-path polygon图形构建与动画变换二三事
2015年03月26日，星期四本文絮絮叨叨CSS3 clip-path polygon在图形构建和动画这块的三两事，没什么惊天动地的知识点，大家可以当散文看下。放心，有demo有截图有代码展示，还有视频播放呢！总之，希望本文的内容能够对您的学习有所帮助。
内容loading加载后高度变化CSS3 transition体验优化
2015年01月22日，星期四现在web技术不断发展，视图与数据渲染更多由前端呈现，后台更多与数据打交道。于是，我们会经常看到这样的交互场景。页面加载，看到一个框框里面有个菊花在转，然后内容呈现；或者点击个按钮，菊花在转，然后列表动态加载呈现。
确实，功能上OK，有菊花，用户也愿意等。但是，大家有没有觉得所有交互，出现菊花→出现内容，都是“砰砰砰”很生硬的感觉，尤其当内容是动态，高度不确定的时候。我们使用一些比较好的手机APP(如微信)的时候一定不会有这样的感觉，整个交互流程都是很流畅的，就像山涧的泉水，涓涓细流到山脚，而不是巨人在峡谷走路的感觉。
所以，如果菊花的呈现到内容的展示能够通过自然的动画过渡呈现，势必会增强用户体验。
而本文就将分享，我是如何渐进处理，让动画过渡呈现更自然的…… 必须的，demo，截图，源代码展示一个不少，希望本文的内容能够对您的学习有所帮助。
小卖弄：纯CSS实现的outline切换transition动画效果
2013年11月13日，星期三我记得有个版本的迅雷软件，会发现focus文本框时候，其外发光的外挂会跟着动画移动。据说这一系列N动画交互引擎的维护成本还是挺高的。
今天，偶然看到一个名叫Nikita Vasilyev的兄弟在web页面上折腾了个类似效果。其是JS实现的，我习惯性就想，可不可以CSS实现呢，一番折腾，发现，竟然……
贝塞尔曲线与CSS3动画、SVG和canvas的基情
2013年08月30日，星期五CSS3动画、SVG和canvas都与贝塞尔曲线存在基情关系，哟呵呵呵，本文就将揭示其中不为人知的基情，习惯八卦的你可不能错过哦……
URL锚点HTML定位技术机制、应用与问题
2013年08月25日，星期日
关于锚点，我3年前就写过关于锚点跳转及jQuery下相关操作与插件，不过内容略浮躁，都是偏表象、偏基本应用层面的东西；这里还是关于锚点，探讨的内容可能更深层次一点。
我们可能就很简单地认为锚点定位的触发是通过点击事件。而实际上，这种顺势而然的理解类似于古人理解为太阳绕着地球转一样，是有失偏颇的。我个人认为，锚点的定位是通过……
长篇，内容丰富，干货较多，希望本文内容能够对您的学习有所帮助！
小tip: transition与visibility
2013年05月14日，星期二这里的transition指的就是CSS3中的那个过渡动画属性transition. 如果我们仔细查看其支持的CSS属性值，会发现竟然有一个visibility.
此时，我的脑袋上立马冒出了3个大大的问号：visibility不就visibile/hidden/collapse等值，又不是数值什么的，怎么有动画效果呢？？
一番查阅研究，发现，这玩意还是有些作料的……
我的应用
我的应用