浏览器
7篇文章 · 0订阅
  • 利用"交叉观察者"这个小宝贝儿，轻松实现懒加载、吸顶、触底 ❗
    直接进入正题，IntersectionObserver 翻译为 "交叉观察者"，它的任务就是监听目标元素跟指定父元素（用户可指定，默认为viewport）是否在发生交叉行为，简单理解就是监听目标元素是否进入或者离开了指定父元素的内部（理解这句就行了，管他交不交叉呢），我好像在开…
    JavaScript
    利用"交叉观察者"这个小宝贝儿，轻松实现懒加载、吸顶、触底 ❗
  • wasm + ffmpeg实现前端截取视频帧功能
    有没有那么一种可能，在前端页面处理音视频？例如用户选择一个视频，然后支持他设置视频的任意一帧作为封面，就不用把整一个视频上传到后端处理了。经过笔者的一番摸索，基本实现了这个功能，一个完整的demo：ffmpeg wasm截取视频帧功能： 支持mp4/mov/mkv/avi等文件…
    JavaScript 前端 编译器
  • HTML5 Audio & Video - 兼容性总结（一）
    一、audio1、监听播放完成监听ended事件不准确，可以监听timeupdate事件，判断当前播放进度currentTime大于等于总时长duration时，就是播放完成；2、设置当前音频播放时间
    HTML
  • 使用 JS 来动态操作 css ，你知道几种方法？
    JavaScript 可以说是交互之王，它作为脚本语言加上许多 Web Api 进一步扩展了它的特性集，更加丰富界面交互的可操作性。这类 API 的例子包括WebGL API、Canvas API、DOM API，还有一组不太为人所知的 CSS API。 由于JSX和无数JS框…
    CSS JavaScript
  • 移动端H5页面开发坑点指南
    在安卓中，直接使用原生 video 会导致全屏播放，盖住所有元素，因此使用 x5 播放器。但是 x5 播放器还是存在问题，虽然不会盖住元素，但是会自己添加特效（盖一层导航栏蒙层）。 这样可以在安卓下使用 x5 播放器， playsInline 及 webkit-playsinl…
    CSS
  • 现代浏览器观察者 Observer API 指南
    前段时间在研究前端异常监控/埋点平台的实现。 在思考方案时，想到了浏览器自带的观察者以及页面生命周期API 。 Intersection Observer，交叉观察者。 Mutation Observer，变动观察者。 Resize Observer，视图观察者。 | 用途 |…
    Vue.js JavaScript
    现代浏览器观察者 Observer API 指南