H5+JS+CSS3圣诞贺卡制作视频教程-慕课网

课程 \前端开发 \CSS3 \H5+JS+CSS3 实现圣诞情缘

H5+JS+CSS3 实现圣诞情缘

                
                Aaron艾伦
            Web前端工程师

                    查看讲师更多课程 
                    Aaron艾伦讲师的其他课程
                
jQuery基础(二)—DOM篇
入门·95339
免费课程
                                
H5+JS+CSS3实现七夕言情
中级·174609
免费课程
                                
jQuery基础(四)—动画篇
初级·72882
免费课程
                                
jQuery基础(三)—事件篇
入门·73296
免费课程
                                
jQuery基础 (一)—样式篇
入门·170952
免费课程
                                
jQuery源码解析（DOM与核心模块）
高级·64951
免费课程
                                
                难度中级
            
                时长 2小时33分
            
                学习人数
            
综合评分9.7
                            46人评价
                        查看评价
                                9.9
                                内容实用
                            
                                9.4
                                简洁易懂
                            
                                9.7
                                逻辑清晰

简介：圣诞节将近，帅哥美女相约，送一份特别的礼物，让TA过一个不一样的节日。本课程中使用面向对象的编程方式，采用H5+JS+CSS3的混合使用实现整个功能。课程当中总共分为3个主题场景图，多个精灵图以及雪碧图，实现了静与动的完美结合，并且由浅入深的将整个案例拆分讲解。

1章效果预览与介绍

本章主要介绍课程实现的效果以及案例中要用到的主要技术

1-1 课程简介 (03:16)

2章设计思路与蕴涵的知识点

本章主要介绍课程的整体框架，整体思路以及蕴涵的知识点

3章技术点的分解

本章主要介绍该案例要用到的详细的知识点，并将对这些知识点进行一一的讲解

4章整体结构与镜头切换效果的实现

本章主要对布局结构、镜头效果、代码封装、场景切换以及场景音乐的介绍

5章场景页面A

本章主要是对圣诞树、月亮与云、圣诞雪橇、SVG星星以及3D开创效果这些场景的解析

6章场景页面B

本章主要是对小男孩和小女孩的动作分解，以及讲解3D的旋转特效

7章场景页面C

本章主要讲解了3D关窗的效果以及canvas绘制的飘雪效果

8章最终效果与总结

本章会给大家展示案例的最终效果，也会将案例所用到的知识给大家作一个总结

8-1 最终效果与总结

开始学习

课程须知: 本课程为高级案例课程，其中所用的大部分知识点不做深入剖析，只讲解如何使用，部分代码需要由你自己填充。需要具备如下知识： 1、HTML4、HTML5 2、CSS2、CSS3 3、JavaScript、jQuery 4、面向对象思想 5、SVG基础知识 6、Canvas基础知识

老师告诉你能学到什么？: 1、rem式布局 2、转场特效 3、异步编程处理 4、CSS3动画过渡 5、JS动画实现 6、H5的音乐效果 7、H5的视频效果 8、SVG画图 9、canvas画图

H5+JS+CSS3 实现圣诞情缘

1章 效果预览与介绍

2章 设计思路与蕴涵的知识点

3章 技术点的分解

4章 整体结构与镜头切换效果的实现

5章 场景页面A

6章 场景页面B

7章 场景页面C

8章 最终效果与总结