在最新版的Chrome浏览器（以及所有以Chromium为内核的浏览器）中，已不再允许自动播放音频和视频。（Google的某些做法还真是令开发者不爽）。就算你为video或audio标签设置了autoplay属性也一样不能自动播放。 如果你用 javascript 代码显式调用play方法： 你将会在控制台看到如下异常： Uncaught (in promise) DOMException: play() failed because the user didn't interact with the document first. Firefox也有类似的异常提示： NotAllowedError: The play method is not allowed by the user agent or the platform in the current context, possibly because the user denied permission.…
HTML5页面： 打开出错，提示： Uncaught TypeError: audio.play is not a function HTML5报错audio.play is not a function解决方法 play()方法属于DOM对象方法，$('#audio1')为jquery对象，jquery对象调用DOM对象的方法导致了上述错误，只需将jquery对象转换为DOM对象即可：
引言 图片处理在前端工作中可谓占据了很重要的一壁江山。而图片的 base64 编码可能相对一些人而言比较陌生，本文不是从纯技术的角度去讨论图片的 base64 编码。标题略大，不过只是希望通过一些浅显的论述，让你知道什么是图片的 base64 编码，为什么我们要用它，我们如何使用并且方便的使用它，并让你懂得如何去在前端的实际工作中运用它。 什么是 base64 编码? 我不是来讲概念的，直接切入正题，图片的 base64 编码就是可以将一副图片数据编码成一串字符串，使用该字符串代替图像地址。 这样做有什么意义呢？我们知道，我们所看到的网页上的每一个图片，都是需要消耗一个 http 请求下载而来的（所有才有了 csssprites 技术的应运而生，但是 csssprites 有自身的局限性，下文会提到）。…
<style type="text/css"> .table {display:table; text-align:center;} .row {display:table-row;} .cell {display:table-cell; vertical-align:middle; width:100px; height:100px; background-color:#063; border:1px solid #000;…
<audio id="audio1" controls="controls"></audio><br/> <input name="btnPlay" id="btnPlay" type="button" value="播 放"> <script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.min.js"></script> <script type="text/javascript"> $(document).…
页面中img和input顶部总对不齐，预览效果如下： img和input设置vertical-align:middle即可解决：
<style type="text/css"> body,td,th { font-size: 12px; color: #000; } body { margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; background-color: #FFF; } a { font-size: 12px; } a:link { text-decoration: none; } a:visited { text-decoration: none;…
1、DIV固定浮动在网页顶端代码 说明：要使div里的文本居中，增加“width:100%; text-align:center;”即可（下同）。 2、DIV固定浮动在网页底部代码 完整示例
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>css设置table边框1px并居中显示-Mzwu.COM</title> <style type="text/css"> table { margin: auto; width: 90%;…
CSS Usage是Firefox的扩展(依赖于Firebug)，用它可以扫描出页面哪些css有使用，哪些没有使用，并支持导出干净的css，这样非常方便找出页面没使用的css并移除：