本文主要介绍了HTML5 HTMLCollection和NodeList的区别详解，分享给大家，具体如下： 获取 HTMLCollection 对象 getElementsByTagName() 方法返HTMLCollection对象。 HTMLCollection 对象类似包含 HTML 元素的一个...

看到了很多人写的太极图案，自己也来搞一下，今天就来介绍一下 css样式代码 .animation{ width: 800px; height: 800px; border: 1px solid #000;}#canvas{ animation: rotate 6s linear infinite; }/* 给太极图设置旋转...

W3C HTML 5.2 规范中， 有一节 介绍该版本引入的修改，我综合来自 《Whats New in HTML 5.2?》 这篇文章的描述，在此列举对我来说比较重要的部分。 新特性 原生 dialog 元素 对话框在平时开发...

获取 PCM 数据 处理 PCM 数据 Float32 转 Int16 ArrayBuffer 转 Base64 PCM 文件播放 重采样 PCM 转 MP3 PCM 转 WAV 短时能量计算 Web Worker优化性能 音频存储(IndexedDB) WebView 开启 WebRTC 获取 PCM 数据 查看...

前言 在项目上，需要等页面加载完之后再执行一个方法用于修改页面的颜色，于是导出都是在使用onload解决，然而这并不能解决我遇到的问题，因为我发现，我项目上的页面仍然没加载...

用什么代码实现？不允许有白色底色产生，因为手机高度不一样 设计图要标准（750）确认是背景图（通屏底图）应用场景：移动端宣传页面或者活动页面 错误的写法：加到div中结合图...

HTML5中新添加了很多事件，但是由于他们的兼容问题不是很理想，应用实战性不是太强，所以在这里基本省略，咱们只分享应用广泛兼容不错的事件，日后随着兼容情况提升以后再陆续...

最近在学习html5，今天看到了一个效果感觉不错，就分享给大家，也给自己留个笔记，具体如下 需要效果 1、首先引入scroll.js 2、html部分 !-- 科目导航 -- div id=navBox class=navMain ul class=nav...

企业内部H5微应用开发 分为 服务端API和前端API的开发，主要涉及到进入应用免登流程和JSAPI鉴权。 JSAPI鉴权开发步骤： 1、创建H5微应用 登入钉钉开放平台（https://open-dev.dingtalk.com/）,进...

1、H5页面是运行在微信浏览器的 2、需要与公众号关联（即需要openid） 3、判断需求是否需要弹窗告知用户授权操作 4、获取地址栏参数判断是否有'code',有的话直接传给后台换取openid,没...

input调用设备录像，相机等 HTML5官方文档解释：capture属性用于调用设备的摄像头或麦克风。 当accept=audio/或video/时capture只有两种值，一种是user，用于调用面向人脸的摄像头(例如手机前...

!DOCTYPE htmlhtml lang=enhead meta charset=UTF-8 titleaudio/title/headbodyaudio controls=controls source src=video/Light.mp3 type=audio/mpeg source src=video/Light.ogg type=audio/ogg 您的浏览器太low了/audiovideo controls muted poster...

情景一： 【原URL http://www.yidunidc.com/tw.html复制请保留原URL】 问题背景：生成的图片在一个弹窗里面，如果页面没有滚动条就是正常的，但是一旦出现滚动条并且页面发生滚动时html2can...

背景：video下载入ogg格式视频，并设置自动播放属性autoplay，但是使用Chrome预览时，视屏画面已加载出来，但是无法自动播放，F5刷新后可以自动播放。使用火狐浏览器可以自动播放。最...

今天公司有一个新的需求，就是要在返回的作业照片里面可以涂鸦批改，批改完后就连同批改后的照片上传到服务器。这对我不怎么熟悉canvas的人来说是个挑战。 需求分析 能进行批改...

video实现自动播放有声音 需求：老板见人家【文章出处:http://www.yidunidc.com/hkzq.html欢迎转载】可以的，我们的也要可以！！！ 前端：自动播放，简单... 要实现：鼠标移入视频播放同时有...

为什么要使用video.js？ 1. PC端浏览器并不支持video直接播放m3u8格式的视频 2. 手机端各式各样的浏览器定制的video界面风格不统一，直接写原生的js控制视频兼容性较差 3. video.js解决以上两...

video标签 浏览器的video标签通常是接收一个src属性，然后浏览器就会根据这个src属性来自动加载视频。 这个过程是浏览器来加载video的。 这种方式有什么问题吗？ mp4文件不能流式加载...

localStorage，sessionStorage，cookie的简单介绍 localStorage:仅在客户端存储不参与服务器通信，存储大小一般为5M，如果不是人为清除，那么即使是关闭浏览器也会一直存在。 sessionStorage:仅在客...

写在前面 前一篇文章介绍了HTML5中的Blob对象（详情戳这里），从中了解到Blob对象只是二进制数据的容器，本身并不能操作二进制，故本篇将对其操作对象FileReader进行介绍。 FileReader...

在H5页面中嵌入视频的情况是比较多件的，有时候会碰到需要自动播放的情况，之前根本觉得这不是问题，但是自己的项目中需要视频的时候就有点sb了，达不到老板的要求，那个急呀...

打开一个视频，在点击播放之前会看到一张封面图，点击之后封面消失，随即播放视频。 若现有一需求，要你自定义给某个视频设置封面，应该怎么做呢？ 此时可使用H5 video提供的po...

今天按照网上例程写小米官网，结果发现 这一部分 设置一个父盒子 然后子盒子分别设置左右浮动，代码如下： .banner {width: 1226px;height: 670px;background-color: green;margin: 0 auto;}.banner .banner...

【文章出处:外国服务器】 recorder.js microphone基于HTML5的录音功能，输出格式为mp3文件。 前言 完全依赖H5原生API 所涉及的API：WebRTC、AudioContext、Worker、Video/Audio API、Blob、URL 兼容性 Chrome、...

下面通过代码给大家介绍html5拖拽应用记录，具体代码如下所示： e.dataTransfer.setData(a,设置的值);e.dataTransfer.getData(a);function drop(e){ !--尝试console.log(e),这里能拿到好多你用得到的api-- e.da...

直播间评论滚动效果，下划查看历史消息并停止滚动，如有新消息会出现新消息提醒，点击滚动到底部。 2.具体代码 template div class=comment div class=comment-wrap ref=wrapper ul class=list ref=list l...

需求催动此篇博客的诞生 项目背景 之前也没写过小程序但是看过之后都是现成的api 简单易懂 唯一就是会有很多坑要去踩 以为要写原生小程序 但是 是我想多了 公司是要节约开发成本...

最近接手了一个小型的H5，最主要的功能大概就是拍照上传和canvas画板了。 主要是记录一下自己菜到像傻子一样的技术。 1、canvas画板隔空打牛！画布越往上部分错位距离越小，越往下...

前言 本代码适用于1920*1080的视频，如果是其他尺寸的视频，需要更改js代码里的几个数字，重新计算视频宽高 效果图 如图所示， 在长屏手机里，横过来的视频高度充满，宽度自适应后...

h5页面唤起app如果没安装就跳转下载(iOS和Android) 浏览器和app没有通信协议，所以h5不知道用户的手机释放安装了app。因此只能是h5去尝试唤起app，若不能唤起，引导用户去下载我们的ap...

NO.1 前言 Tooltips常被称为 提示框（或信息提示框） ，提示框能够以较强的交互性、自由度为用户提供相应的提示信息。今天我们要聊的不是如何实现强大的交互行为，而是来看看如何以...

在传统的 web 优化中，我们可以采取压缩、拆包、动态加载等方法减少首屏资源大小，也能通过离线包、页面直出等方案加速 html 返回，之前一篇h5 秒开大全有部分简析。在大部分场景...

公司项目之前已有支付宝支付，现要求增加微信支付，第一次做，摸着石头过河！结果是满意的。 废话就不说了直接上代码： var aliChannel = null; var wxChannel = null; // 定义支付方式切换...

最近在写一个类似截图里的简易画图的小工具，画线，画矩形，画圆，可以选择颜色，就像这样 写的过程中遇到了一些坑，还好爬出来了，也得到几位大佬的指点，稍微接触了一下zr...

我们通常在做图片上传的时候都会遇上这样的情况，一是后端接口限制上传图片的大小，或者是即使后端没有限制大小，因为图片太大在前端渲染时太慢，造成页面加【来源：海外服务...

一. 什么是吸顶? 吸顶效果是web开发中一种常见的交互方式，常见的应用场景有导航、搜索框等等。能够做流量的横向分发，瞩目的吸顶效果和横滑切tab的手势，能够让用户快速发现更多...

原生js写的一个九宫格抽奖程序 （周末在家闲着也是闲着） 我写的这个抽奖是拿来整蛊我女朋友， 因为每次抽奖的结果都是同一个。。 哈哈哈哈哈哈哈哈哈哈哈哈哈 我会附上正常抽奖...

为什么要使用Application Cache技术？ 在HTML5之前，我们需要接入网络才能访问，这毫无疑问是网站多次请求服务器，造成速度变慢，对于PC用户，网络相对比较稳定，载入速度也不会差太多...

最近在做一个直播推流的功能，想自己写个网页进行直播尝试一下。 然后网上试了各种教程都没成功，下面说下遇到的几个坑。 1.首先通过obs进行推流，服务器是：rtmp://192.168.0.221/li...

前言 在 Canvas 中对文本填充水平或垂直的线性渐变可以轻易实现，而带角度的渐变就复杂很多；就好像下面这样，假设文本矩形宽为 W , 高为 H , 左上角坐标为 X, Y 。 猜想与答案 给出两...

一张网页，如果标题只有文字，那会显得特别单调；那么如何加入一个小图标呢，废话不说，代码展示。 在html中的head标签里： head meta charset=UTF-8 title叮叮书店/title link href=images/logo.i...

在网站制【本文来源：bgp服务器 欢迎转载】作中有很多部分的代码是相同的，如footer部分，可以把这段代码提取出来，在别的页面调用。 index.html !-- 底部加载外部文件 -- footer class=fo...

概要 本次我们会使用html5和js开发一个动态音频图 用到的技术点： （1）js （2）canvas + audio （3）Web Audio API 实现方式： （1）首先对于界面实现的考虑，由于区块非常多，我们使用传统...

许久没有写博客了，最近有个H5启动APP原生页面的需求，中间遇上一些坑，看了些网上的实现方案，特意来总结下 一、需要判断客户端的平台以及是否在微信浏览器中访问 1、客户端判...

1、问题由来 做h5 已经有很长一段时间了，现在做的工作h5比pc上的更多，曾经解决pc端IE各个版本的兼容性也是伤透脑筋，原以为h5的会更好，殊不知，还有更头疼的问题，当设计师要设...

position语法： position : static absolute relative position参数： static : 无特殊定位，对象遵循HTML定位规则 absolute : 将对象从文档流中拖出，使用left，right，top，bottom等属性进行绝对定位。而其层...

最近在跟的一个深圳屋祺项目，由于一些内部原因这次我们需要自己写静态页面。兵来将挡水来土掩，既然组织 需要那就做呗。其中有一个页面布局如下所示， 红色方框标注的部分是...

background-clip 属性规定背景的绘制区域。 默认值： border-box 继承性： no 版本： CSS3 JavaScript 语法： object.style.backgroundClip=content-box background-clip: border-box|padding-box|content-box; border-box 背景被...