• 11h

    课程时长

  • 无限期

    有效期

  • 1297

    学习人数

课程参数
学前基础要求
1.具备HTML和CSS基础编程能力 2.具备一定的JS基础知识

课程简介

该课程详细全面的介绍并实现网站中主要应用的动态效果,在练习动效的同时,让学员重新认识DOM、元素节点、课程语句等相关操作及应用。案例与知识点的有效结合,能够让学员在实际开发过程中灵活运用并且更透彻的理解知识点。

适合人群

1.适合有HTML和CSS基础的人群

2.掌握一定的JS基础知识的人群

课程亮点

1.科学的授课方式,知识点由浅入深,层层剖析

2.丰富且酷炫的案例分析及实现,如轮播图、旋转木马等,打造生动形象的动态网页效果

3.提供各种应用型解决方案

主讲内容

1-轮播图和焦点图案例

2-放大镜案例

3-互联网全终端项目-好客租房项目

4-正则表达式语法和使用

5-5-offset系列属性使用介绍

6-Math对象的常用方法

7-动画函数使用介绍

8-scroll系列属性使用介绍

9-缓动动画封装及案例

10-访问属性的两种方式

11-获取计算后样式的兼容函数

12-封装缓动框架使用介绍及案例

13-client系列属性使用介绍

14-offset、scroll、client三大系列总结

15-client系列属性应用介绍

16-数组复习

17-旋转木马案例

18-事件对象

19-三个重要坐标

20-可拖拽效果案例

21-滚动条特效案例

22-事件冒泡和阻止冒泡及案例

23-事件对象兼容处理

24-鼠标事件和键盘事件

25-按回车键切换文本框

26-按esc关闭

27-表单事件

28-完整版表单验证案例

29-封装trim方法

30-递归使用介绍

实战项目

旋转木马案例

该项目效果的实现,首先需要建立一个数组给每一张图片写出对应的z-index, opacity, top, width等属性;进而将数组中第一组值放到最后一组,点下按钮执行操作,最终实现旋转的操作。在此期间,应用动画的封装来加快开发的效率。

学完收获

1.实现轮播图动画效果

2.实现旋转木马动画效果

3.实现手风琴动画效果

4.实现放大镜效果等

师资团队
  • 前端高级讲师
    高级讲师
    前端开发工程师和软件开发工程师, 具有多年软件开发项目经验,曾就职于某大型外企,在软件开发和培训方面积累了丰富的经验,精通Ajax、Linux、ThinkPHP、Yii、SVN、jQuery、Redis、Mysql、XML等,上课语言幽默,逻辑清晰。