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

常用的网页加载进度条

孙吉星 交互设计师
难度中级
时长 1小时 7分
学习人数
综合评分9.60
97人评价 查看评价
9.8 内容实用
9.5 简洁易懂
9.5 逻辑清晰
应该把js放在页面的最底部吧,这样效果好像更好
是我的网速太快了,第五个案例,每次我都看到的是100%
老师里面的判断确实有问题
,,,,,不知道为什么老师那个成功了
原来是网络问题,就说嘛,一直没法console.log(document.readyState),控制台没有信息反馈,垃圾网络,坑

最新回答 / if_only
可以用后面课程  数字百分比的方法做判断
这课很实用!
完结打卡~~~

已采纳回答 / btxstudio
常见的效果是将进度条的dom结构显示在页面最“前”(使用fixed定位 + 高z-index,提高优先级),主体内容相当于是被“隐藏”(实际是被遮盖)了,所以进度条一打开网页就有,当网页内容全部加载完成后,触发js相关事件,执行回调函数:隐藏进度条的同时显示页面主体内容
想了很久觉得老师的这个方法到底该怎么改进一下,结合之前学习预加载技术课程里老师的代码稍微修改了一下,大家可以看看效果,也欢迎大家来和我交流。
预览地址:https://github.com/iuuan/study-code-demo/blob/master/preload-demo.html
这,老师可以,分享的东西很多,给我们源头,
这个效果我觉得ok,这种实现方法我觉得不行···
老师给的网站好棒

最新回答 / 慕粉3702457
错误1:css中#loading .imag定义了样式 ,而下面的这个div 没有引用错误2:css中有的名字用的是.imag 而有的用的.img错误3:关于 :nth-child() 用的是中文的冒号, 一定要切记写代码语法的时候是不能用中文符号的这3个改完后就可以出来了
按照 这个方法来做没啥效果,也不好调用
课程须知
1、能够熟练使用HTML布局页面 2、了解JavaScript的语法及书写能力
老师告诉你能学到什么?
1、onreadystatechange事件侦测 2、jquery的animate动画的使用 3、javascript定义Image图像对象 4、CSS3的animation动画

微信扫码,参与3人拼团

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

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

本次提问将花费2个积分

你的积分不足,无法发表

为什么扣积分?

本次提问将花费2个积分

继续发表请点击 "确定"

为什么扣积分?

举报

0/150
提交
取消