H5
关注
分享
扫一扫
H5经验
heart °
这个作者很懒，什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
html5生成图片、海报 canvas 2d画布的应用
常用APIfill() 填充stroke() 线条save() 保存当前环境的状态restore() 返回之前保存过的路径状态和属性颜色属性fillStyle 填充颜色strokeStyle 线条颜色font 字体样式textAlign以下canvas表示获取的dom，cxt = canvas.getContext('2d')设置canvas.width = 750, canvas.height = 1334绘制图形矩形fillRect(x,y,width,heigh原创 2021-03-25 15:35:31 · 544 阅读 · 0 评论 -
H5在微信端锁定背景滚动
在微信浏览器中，未做处理时，滚动到顶部，依然能滚动一段距离。现在通过一些方式，来阻止背景的滚动。document.addEventListener('touchmove', function(e) { e.preventDefault()}, { passive: false })原创 2021-03-25 11:38:28 · 574 阅读 · 0 评论 -
html、css文本溢出显示省略号
单行文本溢出省略号<div class="ellipsis example">单行文本溢出省略号</div>.example { width: 90px;}.ellipsis { text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}/*text-overflow (显示省略符号来代表被修剪的文本)white-space (文本不会换行，文本会在在同一行上继续，直到遇到 <br&原创 2021-03-25 10:10:42 · 272 阅读 · 0 评论 -
移动端H5调试方法
Chrome Devtool手机开启调试手机与电脑连接数据线开启开发者选项，开启USB调试开启inspect debug微信打开 debugx5.qq.com ， 信息 -> TBS settings 勾选 打开TBS内核Inspect调试功能 等。打开调试窗口Chrome进入 chrome://inspect/#devices ，在 Remote Target 下列表链接，点击 inspect 进入调试窗口。注意：需要FQ代理进入调试窗在 ping.chinaz.co原创 2021-03-24 18:49:48 · 770 阅读 · 0 评论 -
H5自动播放背景音乐（IOS和安卓）
安卓与IOS播放安卓可以直接使用audio标签进行播放<audio ref="sound" :src="bgm.mp3" loop />const audio = document.querySelector('audio')audio.play()IOS端需要借助微信自带的事件进行播放const audio = document.querySelector('audio')document.addEventListener('WeixinJSBridgeReady',原创 2021-03-23 18:35:31 · 2852 阅读 · 0 评论 -
前端H5移动端自动适配
rem布局使用 js 动态设置 font-size原理：动态设置html根元素的font-size，其大小实际上是可视界面中宽度的1 / 10。js代码如下：// REM布局function setFontSize() { var _document = document, _documentElement = _document.documentElement, html = _document.getElementsByTagName('html')[0], w原创 2020-10-18 22:15:16 · 684 阅读 · 0 评论 -
H5与微信小程序web-view通信
微信小程序里的代码如下：<!-- index.wxml --><web-view src="" bindmessage="msg"></web-view>// index.jsApp({ msg(e) { console.log(e) }, onShareAppMessage() { return {} }})H5的代码如下：<!-- index.html --><body> <原创 2020-10-17 23:57:56 · 778 阅读 · 0 评论