微信小程序开发设置透明度（微信小程序按钮透明）
今天给各位分享微信小程序开发设置透明度的知识，其中也会对微信小程序按钮透明进行解释，如果能碰巧解决你现在面临的问题，别忘了关注本站，现在开始吧！
本文目录一览：
微信小程序：背景图片透明处理（采用CSS/wxss）
例如：
其中0.5是图片透明度
例如：
其中0.95是背景图透明度，使用效果如下图：
微信小程序透明度的属性是
微信小程序透明度 opacity 原创
2017-05-23 11:28:29
5点赞
UFO00001
码龄7年
关注
wxml文件中 ：style="opacity:{{number}}"
number代表透明度的值 取值范围0—1 1代表不透明 0代表全透明
具体应用中可在js文件中写个方法对number根据用户动作进行动态设置
看文章 扫一扫 领红包哦
文章知识点与官方知识档案匹配
小程序技能树page.json配置globalStyle全局样式配置
3393 人正在系统学习中
16进制颜色码，设置透明度不兼容问题
在做微信小程序过程中，遇到一个问题。iOS系统的手机上，样式显示正确无误，但是Android手机上样式有误。最后发现是因为如果用16进制表示颜色，并且设置了透明度，如#FFFFFFFF（后两位FF代表透明度1），在Android系统下不能被正确识别。
所以最后解决的办法就是采用rgb表示，如将#FFFFFFFF改写为rgb（255,255,255,1），在安卓系统下也能正确显示颜色了。
在寻求解决方法的时候还看到此类问题还出现在，谷歌浏览器能识别16进制颜色8位的这种形式，在其他浏览器上就不兼容，所以建议大家以后可以习惯使用rbg来表示颜色吧。
附：16进制-RBG在线转换网站
微信小程序-video禁止拖动进度条
小程序项目中涉及到视频功能，需求就是禁止拖动进度条。但是小程序video并没有提供一个属性用来禁止进度条拖动
以上是从微信官方论坛中找到的答案，就是说如果想实现禁止拖动进度条，要么就是隐藏掉，要么就是自己自定义一个进度条。如果用show-progress=‘{{false}}’，这个属性隐藏掉了进度条，那video原本自带的底部控制栏中（播放/暂停 ，进度时间，进度条，总时长，全屏/退出全屏），这些按钮中，就只剩下全屏/退出全屏了。
开始，我决定自定义进度条，但是我发现video里嵌套的组件，虽说官网给出的是可以使用view，但是只有界面效果，却触发不了view对应的方法，也就是说，我用slider组件自定义了一个进度条，并且禁用，然而不管用。
于是乎，几经波折，来回调试，最终还是决定用video自带的控制栏，通过在进度条位置，设置一个遮罩层，再设置一下透明度，这样，光标点不到进度条，就拖动不了了。当然，这个遮罩层也是要用cover-view
在设置遮罩层时，还遇到了问题，就是position: relative; opacity:0;无效！！！
改成这样：：position: absolute;opacity:0;模拟器，安卓手机上都没问题，iOS真机上无效！！！
但是我发现，将透明度改大一点，大于0，iOS上就可以了。
所以，我用
wx.getSystemInfo,来判断设备，如果是iOS，那就设置透明度为0.1，如果是安卓，就为0.
其实到这里，问题基本解决了，但是还有一点点瑕疵，就是因为保留了本身的控制栏，那全屏/退出全屏的按钮功能要保留，所以遮罩层不能罩到要用的按钮，不然就都点击不了，所以在使用的按钮上我用view，设置了一个跟遮罩层一样颜色一样透明度的还补全，这样从视觉效果上才算是过关。
微信小程序开发设置透明度的介绍就聊到这里吧，感谢你花时间阅读本站内容，更多关于微信小程序按钮透明、微信小程序开发设置透明度的信息别忘了在本站进行查找喔。
