gaogao1994 / my_resume

个人电子简历，原生js书写

我的电子简历

说明：

关于标题：

标题的粘滞效果本来是准备使用position: sticky的，后考虑到在旧版浏览器中的兼容性，还是采用了scroll事件来监听每一个div是否进入粘滞区。 值得注意的是，当标题处于上方粘滞的时候，右侧菜单也会随之更新。

技能进度条：

用一个scroll事件去探测该区块的底部是否高于页面的底部，满足条件后触发效果，并且将该事件移除。

图片懒加载：

图片先使用尺寸相当小，但是高宽比相同的缩略图替代。 当页面滚动时候，探测图片是否在视窗中，即图片顶部高于页面底部，并且图片底部低于页面顶部。 图片进入视窗，就准备一个Image对象，设置其src，去预先加载图片。 加载完成后，将原图片的src修改，以便从缓存中读取，并设置完成的class，做动画效果。

移动端适配：

简历可以适应不同大小的屏幕，PC端时导航栏置于右侧；当屏幕尺寸小于768px时导航栏移到头部隐藏区域，相应的主题内容也做了适当调整