为了账号安全,请及时绑定邮箱和手机立即绑定

如何实现“新手引导”效果

江老实 Web前端工程师
难度初级
时长50分
学习人数
综合评分9.63
118人评价 查看评价
9.6 内容实用
9.6 简洁易懂
9.7 逻辑清晰
简介:通过本案例,你将会学习如何制作蒙版,详细了解绝对定位的方法,全面掌握cookie的设定,更重要的是能够用原生JavaScript代码和JQuery两种方式来对“新手引导”中引导单元的依次显示。

第1章 新手引导简介

对案例的最终实现效果进行展示,并把这个效果的实现思路进行详细分析。

第2章 HTML结构介绍

对实现案例效果的HTML结构布局进行逐步实现,添加蒙版、定义父块及各个引导单元。

第3章 网页蒙版设置

对网页蒙版的高度、位置、透明度及浏览器的兼容情况进行详细讲解。

第4章 引导单元定位

对父块的宽度、位置、背景等参数进行设置,并且利用绝对定位的方法对各个引导小单元进行定位。

第5章 JavaScript控制引导单元的显示

首先对引导单元的逻辑顺序进行分析,通过编写JavaScript原码,实现对各个引导单元的显示顺序进行控制。

第7章 另外一种交互实现方式——jQuery

对JavaScript源码实现的引导单元的显示效果,用jQuery进行简化。

第8章 总结

这个案例中所用的知识点你都学会了吗?最后来回顾一下,一定要练习呀!
课程须知
1.对div和css相关内容精通掌握;2. 具有一定的JavaScript和JQuery知识基础
老师告诉你能学到什么?
1.掌握“新手引导”的实现思路 2.了解html结构布局 3.掌握简便的定位方法 4.学会用 原生JavaScript代码和JQuery两种方式实现依次显示效果

微信扫码,参与3人拼团

意见反馈 帮助中心 APP下载
官方微信
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!