HTML5前端特效第一季（基于webstorm）

Posted 2021-04-04 SiKi

本课程属于 JavaEE A 计划，不单独售卖，加入 A 计划可免费观看本课程及所有 JavaEE 收费课程~

JavaEE A 计划一年有效期购买链接：

http://www.sikiedu.com/classroom/12/introduction

课程介绍：本课程属于中级课程，使用html5+CSS3创建5类Web前端特效，其中一部分需要使用js和jquery知识。实现的特效主要有动态显示与隐藏部分文字的折叠效果，炫酷的复选框按钮，翻书特效，无JS的波形加载条，边框的流动彩条，环形进度条。其中的翻书特效和环形进度条使用了第三方插件，并进行了系统讲解，每个插件又进行了4，5种场景应用实例。尤其是环形进度条的文件上传实例，还涉及到一部分的Java后台编码，应用到了SpringBoot和SpringMVC的一些基础知识。对于Java开发不甚了解的同学可以跳过相关课程，直接观看前端讲解即可。

老师希望大家都能够学会并掌握这些前端特效的实现，甚至做出更加炫酷的效果，让自己的开发技能更上一层楼。

HTML5基本语法 传送门 http://www.sikiedu.com/course/206

CSS3基本语法 传送门 http://www.sikiedu.com/course/207

JS编程基础语法 传送门 http://www.sikiedu.com/course/212

Jquery的选择器语法 传送门 http://www.sikiedu.com/course/213

课程链接：http://www.sikiedu.com/my/course/487

课程目录

00-课程展示

01-折叠隐藏文字-效果展示-居中布局

02-折叠隐藏文字-圆角及隐藏span元素

03-折叠隐藏文字-过度显示折叠元素

04-折叠隐藏文字-最终效果

05-炫酷复选框-效果展示-居中布局

06-炫酷复选框-边框凹槽样式

07-炫酷复选框-内部按钮的布局定位

08-炫酷复选框-内部按钮动起来

09-炫酷复选框-最终效果

10-翻书插件turnjs-效果展示-插件说明

11-翻书插件turnjs-图书居中显示

12-翻书插件turnjs-单独设置页面样式-硬软翻页类

13-翻书插件turnjs-首页封面布局

14-翻书插件turnjs-首页居中-第一页布局

15-翻书插件turnjs-首行缩进和页码

16-翻书插件turnjs-其它页和图书阴影

17-翻书插件turnjs-由图片显示的图书-杀戮都市

18-翻书插件turnjs-常用类

19-翻书插件turnjs-重要属性1

20-翻书插件turnjs-重要属性2

21-翻书插件turnjs-重要方法-添加删除页

22-翻书插件turnjs-重要方法-其它操作

23-翻书插件turnjs-zoom-最简单的方式

24-翻书插件turnjs-zoomjs实现缩放1

25-翻书插件turnjs-zoomjs实现缩放2

26-翻书插件turnjs-使用事件控制上页下页按钮

27-翻书插件turnjs-页面缺少事件missing

28-波动加载条-基本布局和基本样式

29-波动加载条-关键帧动画-基本波浪

30-波动加载条-处理抖动-两边波动

31-波动加载条-波动效果的加载文字

32-波动加载条-音频波动效果-基本布局

33-波动加载条-音频波动效果-核心js代码

34-波动加载条-音频波动效果-使用音频数据显示波形

35-流彩边框-效果展示-基本布局

36-流彩边框-四边定位-上边动画

37-流彩边框-四边流动-首尾衔接

38-流彩边框-悬浮流动

39-环形指示器-效果下载介绍

40-环形指示器-基本属性

41-环形指示器-高级属性-动态值

42-环形指示器-animate函数和叠加图片

43-环形指示器-冷却扇形-效果布局-基本扇形

44-环形指示器-冷却扇形-动态倒计时

45-环形指示器-环形时钟

46-环形指示器-上传进度-效果展示-IDE安装说明

47-环形指示器-上传进度-创建SpringBoot工程

48-环形指示器-上传进度-添加控制器和thymeleaf的依赖

49-环形指示器-上传进度-表单和环形进度条布局

50-环形指示器-上传进度-编写接收上传数据的java代码

51-环形指示器-上传进度-实现基本的文件上传

52-环形指示器-上传进度-使用ajax关联上传进度和指示器

http://www.sikiedu.com/my/course/517

点击阅读原文进入SiKi学院观看