H5+JS+CSS3 综合应用

慕课网新教程H5+JS+CSS3 实现的七夕言情主题效果已经出炉了css

从设计到实现到录制与编写用了快1个月的时间,说真的这个案例是慕课定制的,我以前也没有系统的作过这样的一个效果,在实现的时候本身也从新复习了下CSS3动画的知识点前端

下面是一个简单的预览css3

x

这个是一个比较综合的效果了,这个案例把前端作动画的一些精髓已经讲透了编程

运用的技术基本就是H5+JS+CSS3,可是每一个部分的实现都会有不少知识点的涉及promise

这里大致的总结下异步

  • 自适应分辨率的问题能够采用的是JS+百分比布局处理
  • 经过合成"雪碧图"解决图片加载与资源占用的问题
  • "雪碧图"自适应的问题
  • 经过CSS3的animation实现帧动画,而且能够控制状态
  • 布局除了left.top布局外,还可使用最新的css3的transform处理
  • 元素的变化,能够经过设置translate3d启动GPU加速
  • 能够用CSS3的transition作渐变更画
  • HTML5音频的使用
  • 采用promise能够解决异步编程的逻辑嵌套问题
  • 代码组织的一些思路

整个案例涉及的东西都是咱们平常开发可以使用到的一些手段,但愿能够经过这个案例把前端的一些方面的知识点给融合贯穿起来,从而获得系统透彻的理解,而且能有触类旁通,融汇贯通的效果!异步编程

教程连接 http://www.imooc.com/learn/453布局

相关文章
相关标签/搜索