
前端
小c_|
这个作者很懒,什么都没留下…
展开
-
intersectionobserver API实现懒加载
用法var io = new IntersectionObserver(callback, option)参数:callback参数time:可见性发生变化的时间,是一个高精度时间戳,单位为毫秒target:被观察的目标元素,是一个 DOM 节点对象rootBounds:根元素的矩形区域的信息,getBoundingClientRect()方法的返回值,如果没有根元素(即直接相对于视口滚动),则返回nullboundingClientRect:目标元素的矩形区域的信息intersec.原创 2021-09-13 13:28:18 · 247 阅读 · 0 评论 -
字体转base64
字体转换网站https://transfonter.org/将下载后的文件解压,找到stylesheet.css文件,将内容复制到代码的CSS文件内引用字体,名字为stylesheet.css对应的名字如: font-family: ‘HYZhuZiMuTouRenW’;转载 2020-12-24 14:53:14 · 2345 阅读 · 1 评论 -
流媒体判断横竖屏
@media screen and (orientation: portrait) {/*竖屏 css*/}@media screen and (orientation: landscape) {/*横屏 css*/body { background: blue;}}原创 2020-12-14 15:58:02 · 165 阅读 · 0 评论 -
实现点击伪元素才有点击事件
第一种实现方式只能是绑定一个事件,如点击图片实现查看,点击伪元素实现删除则不可以实现。而且会导致:hover等鼠标事件失效,所以不推荐使用第二种实现方式可以绑定一个事件,如点击图片实现在子元素事件中实现查看,点击伪元素在父元素事件中实现删除。.box2-ul li a:before{width: 100px;height: 65px;pointer-events: auto;content: ‘’;position: absolute;top: 189px;left: 24px;curs原创 2020-09-30 13:53:11 · 891 阅读 · 0 评论 -
滚动条样式
//背景条.dwjdc-context::-webkit-scrollbar {width: .06rem;height: .43rem;background: #3c3a3a;}//滑动条.dwjdc-context::-webkit-scrollbar-thumb {border-radius: 0;background-color: #757879;transition: all .2s;border-radius: .43rem;}原创 2020-09-25 14:32:59 · 103 阅读 · 0 评论