在开门的同时会有一个灯光的变化,开门灯亮,关门灯灭,这个动作本身不难,主要是配合开关门之后的一个效果,需要依赖开关门的事件回调
由于开关门的代码封装了Deferred,我们很容易添加这个效果的逻辑
灯的初始效果是暗的状态,所以需要在PageB.css部分增加一个lamp-bright的样式(一张点亮的背景图),通过增加删除这个样式达到变化的效果
这里唯一要注意的问题就是大图在第一加载时需要时间的,在某些环境下会出现第一次加载闪动的情况,这里增加一个不相关的节点b_background_preload做预加载
代码实现部分:
//开门 openDoor().then(function() { //开灯 lamp.bright(); }) //关门 shutDoor().then(function() { //灯灭 lamp.dark(); });
通过融入Deferred对象,我们可以很好的控制这个逻辑了,在then中直接书写回调后的开灯效果了。
通过点击开门、关门的按钮,可以观察到效果了
打开index.html文件,在代码的138行填入相应代码,可以观察到关灯的效果
lamp.dark();
请验证,完成请求
由于请求次数过多,请先验证,完成再次请求
打开微信扫码自动绑定
绑定后可得到
使用 Ctrl+D 可将课程添加到书签
举报
实战
实战
实战
实战
实战