
html
盼一族
这个作者很懒,什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
React项目,一刷新页面,谷歌浏览器就会弹出翻译提示弹窗
一、现象 现象如下图: 二、原因 原因: html标签 lang 属性设置有误,与react及antd无关。 删除或者改为中文就能解决原创 2021-12-14 13:39:09 · 1597 阅读 · 1 评论 -
rem 实现弹性布局
(function (doc, win) { var docEl = doc.documentElement, resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize', recalc = function () { var clientWidth = docEl.clientWidth; if (!clientWidth) return; docEl.sty原创 2021-05-26 19:21:55 · 84 阅读 · 0 评论 -
element.getBoundingClientRect()
该方法返回一个矩形对象,其中四个属性:left、top、right、bottom,分别表示元素各边与浏览器视窗上边和左边的距离,x、y表示左上角定点的坐标位置。 通过这个方法计算得出的left、top、right、bottom、x、y会随着视口区域内滚动操作而发生变化,如果你需要获得相对于整个网页左上角定位的属性值,那么只要给top、left属性值加上当前的滚动位置。 为了跨浏览器兼容,请使用 window.pageXOffset 和 window.pageYOffset 代替 window.scrol原创 2021-05-07 15:16:05 · 174 阅读 · 0 评论 -
图片懒加载的实现原理
一. 定义 当打开一个有很多图片的页面时,先只加载页面上看到的图片,等滚动到页面下面时,再加载所需的图片。这就是图片懒加载。 二. 作用 减少或延迟请求数,缓解浏览器的压力,增强用户体验 三. 实现方式 1、设置图片src属性为同一张图片,同时自定义一个data-src属性来存储图片的真实地址 2、 页面初始化显示的时候或者浏览器发生滚动的时候判断图片是否在视野中 3、 当图片在视野中时,通过js自动改变该区域的图片的src属性为真实地址。 四.代码部分 1. html部分 <div class="c原创 2021-04-02 16:04:07 · 132 阅读 · 0 评论