最近工作比较忙,但也积累了一些小tips,比较杂,不成系统,也并不很深入,就开一篇笼统的先记录一下,以后再深入挖掘。

1.-webkit-tap-highlight-color

-webkit-tap-highlight-color 是一个 不规范的属性,它没有出现在 CSS 规范草案中。

当用户点击iOS的Safari浏览器中的链接或JavaScript的可点击的元素时,覆盖显示的高亮颜色。

该属性可以只设置透明度。如果未设置透明度,iOS Safari使用默认的透明度。当透明度设为0,则会禁用此属性;当透明度设为1,元素在点击时不可见。

以上是网上找到比较具体的表述,那这个属性是解决什么问题的呢?

之前有做一个移动端页面,一些按钮在ios设备上点击时,会出现透明黑色框框,很困扰,不知道那是啥,遂搜索之得到了解决的方法

.btn{
-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
}

如描述所说的,把透明度设置为0时,会禁用该属性,也就是不会再出现透明黑色框框了。

2.-webkit-user-select

这个属性的作用是决定用户是否可以有选择复制元素或文本等权力。

也是一个移动端页面,需要所有文字元素都不能被选择复制,可以用到这个属性

body{
-webkit-user-select: none;
}

ie是否有效未测,等有空了测一下吧。

3.微信端自动播放audio

一般来说html5页面要自动播放音频文件只需要设置标签属性autoplay就行了,像这样

<audio src="song.mp3" autoplay="autoplay" id="audio"></audio>

但是实际开发中发现,会有很多手机,它在微信端中不能自动播放,安卓ios都有,具体什么原因不太清楚,同为ios9的iphone,有一只9.3能放有一只9.1就不能放了,也是很尴尬

而这样的情况在安卓机中更为普遍。

网上也是寻觅了很久,发现需要调用微信的sdk,在wx.ready中调用play()的方法,才能保证自动播放。

function autoPlayAudio1() {
wx.config({
// 配置信息, 即使不正确也能使用 wx.ready
debug: false,
appId: '',
timestamp: 1,
nonceStr: '',
signature: '',
jsApiList: []
});
wx.ready(function() {
document.getElementById('audio').play();
});
}

说实话这也是挺邪门的,但实测可行。

最近工作的一点小tips的更多相关文章

  1. 工作中的小tips(持续更新)

    1.在工作的时候一定要留下痕迹,这样即使乙方抵赖,或者说领导认为你没干活的时候留下证据(电话没有微信,邮件之类的文字类有效果) 2.每天晚上下班之前将一天的工作总结一下,把第二天的工作给罗列出来,以方 ...

  2. 前端必备,5大mock省时提效小tips,用了提前下班一小时

    ​ 一.一些为难前端的业务场景 在我的工作经历里,需要等待后端童鞋配合我的情形大概有以下几种: a.我们跟外部有项目合作,需要调用到第三方接口. 一般这种情况下,商务那边谈合同,走流程,等第三方审核, ...

  3. 关于cnpm的一点小bug

    在实际工作中,一个项目完成后,在上线前,常常需要把代码进行压缩,一般是用gulp或者 webpack 进行压缩.(小妹是用gulp) gulp是运行在node 环境下的. 所以首先,下载并安装了nod ...

  4. keras搭建深度学习模型的一些小tips

    定义模型两种方法:  1.sequential 类仅用于层的线性堆叠,这是目前最常用的网络架构 2.函数式API,用于层组成的有向无环图,让你可以构建任意形式的架构 from keras import ...

  5. 申请MVP奖励时的小Tips

    大家新年好,今天MSPrecious为大家带来一些申请MVP奖励时的小Tips.   本文分为三个部分 MVP是什么 如何申请MVP 申请MVP需要注意的事项 MVP是什么? 我想,点进来看这篇文章的 ...

  6. HTML meta锚点跳转 小tips

    小tips meta锚点跳转 http://www.zhangxinxu.com/wordpress/2015/03/meta-http-equiv-refresh-content/

  7. 关于win8开发的一点小总结

    我今天做画面的时候,发现了一点小问题. 我在xmal文件里面加了一个CheckBox控件,设置IsChecked属性为True,并添加了Checked事件.Checked事件里面有对另外一个TextB ...

  8. 关于PHP魔术方法__call的一点小发现

    好久没有上博客园写文章了,今晚终于有点空了,就来写一下昨天的一点小发现. 我自己所知,C++,Java的面向对象都有多态的特点,而PHP没有,但PHP可以通过继承链方法的重写来实现多态的属性.而魔术方 ...

  9. Windows7驱动调试小Tips

    v:* { } o:* { } w:* { } .shape { }p.MsoNormal,li.MsoNormal,div.MsoNormal { margin: 0cm; margin-botto ...

随机推荐

  1. ubuntu 进入单用户模式

    进入单用户模式:  按shift进入 1.开机到grub时,用上下键移到第二行的恢复模式,按e(注意不是回车) 即Ubuntu,With Linux 3.2.0-23-generic(recovery ...

  2. NOIP2013 Day1

    1.转圈游戏 https://www.luogu.org/problem/show?pid=1965 这道题失误极大,把freopen注释掉了,导致第一题暴0. 注意:在考试时一定要留下最后的时间检查 ...

  3. linux网络编程、系统编程

    http://blog.csdn.net/lianghe_work/article/category/2871247

  4. python(ValueError: invalid literal for int() with base 10: 'abc' ‘1.0‘’’)强制类型转换

    int()函数只能转化数字组成的字符串,看例子: >>> a=' >>> int(a) 123 >>> b='abc' >>> ...

  5. 字符串的问题(substr,find用法)

    链接:https://www.nowcoder.com/acm/contest/77/C来源:牛客网 字符串的问题 时间限制:C/C++ 2秒,其他语言4秒 空间限制:C/C++ 262144K,其他 ...

  6. JPA基本介绍以及使用

      JPA即Java Persistence Architecture,Java持久化规范,从EJB2.x版本中原来的实体Bean分离出来的,EJB3.x中不再有实体Bean,而是将实体Bean放到J ...

  7. 前段基础之HTML

    HTML 初识 web服务本质 import socket def main(): sock = socket.socket(socket.AF_INET, socket.SOCK_STREAM) s ...

  8. 【UVA】10763 Foreign Exchange(map)

    题目 题目     分析 没什么好说的,字符串拼接一下再放进map.其实可以直接开俩数组排序后对比一下,但是我还是想熟悉熟悉map用法. 呃400ms,有点慢.     代码 #include < ...

  9. CentOS7 tar打包工具 打包,解包,打包压缩,打包解压缩

    tar命令 選項與參數: -c :建立打包檔案,可搭配 -v 來察看過程中被打包的檔名(filename) -t :察看打包檔案的內容含有哪些檔名,重點在察看『檔名』就是了: -x :解打包或解壓縮的 ...

  10. sql,groupby以后取每组前三行

    --> 生成测试数据: #TIF OBJECT_ID('tempdb.dbo.#T') IS NOT NULL DROP TABLE #T CREATE TABLE #T (ID VARCHAR ...