微信小程序实现遮罩及阻止遮罩层下的页面滚动

实现遮罩效果

Html:
<view class="mask-view">
...
</view>

CSS:
.mask-view {
width: 100%;
height: 100%;
position: fixed;
overflow: hidden;
background-color: #ffffff;
z-index: 999;
top: 0;
left: 0;
}

阻止遮罩层下的页面滚动
只需要在遮罩层上加上catchtouchmove="ture"
需要注意的是:因模拟器无touch事件,需在真机上测试

<view class="mask-view" catchtouchmove="ture">
...
</view>

分类至 JS/CSS
0条评论

解决微信小程序inline-block不对齐的方法

解决方法:添加上 vertical-align:top后就会对其。应该是由于默认的 display:inline-block是基于 vertical-align:baseline 对齐的,改变一下 vertical-align 的类型就好了。

<view>
<view style="width:20%; display:inline-block; vertical-align:top;">
<image src="{{item.img}}"></image>
</view>
<view style="width:80%; display:inline-block; vertical-align:top;">
<text>...</text>
</view>
</view>

分类至 JS/CSS
0条评论

CSS calc() 函数

calc() 函数用于动态计算长度值。
需要注意的是,运算符前后都需要保留一个空格,例如:width: calc(100% - 10px);
任何长度值都可以使用calc()函数进行计算;
calc()函数支持 +, -, *, / 运算;
calc()函数使用标准的数学运算优先级规则;

分类至 JS/CSS
0条评论

ES6 简化对象写法

es6简化对象的写法:
同名的属性可以省略,函数可以省略关键字function
var name = 'kobe';
var age = 39;
var obj={
name, //同名的属性可以省略
age,
getName() { //函数可以省略关键字function
return this.name;
}
};

分类至 JS/CSS
0条评论

=> js 中箭头函数使用总结

箭头函数是在 es6 中添加的一种规范

x => x * x 相当于 function(x){return x*x}

箭头函数相当于 匿名函数,简化了函数的定义。语言的发展都是倾向于简洁对人类友好的,减轻工作量的。 就相当于我最钟情的python,有很多类似之处,在关于 promise 文章中我会和 Python 框架中的 tornado 中的异步进行对比的,很相似。

箭头函数有两种格式:一种只包含一个表达式,没有 { } 和 return ;一种包含多条语句,这个时候 { } return 就不能省略。

分类至 JS/CSS
0条评论

微信小程序 json 设置 backgroundColor 无效的问题

当我们在微信小程序 json 中设置 backgroundColor 时,实际在电脑的模拟器中根本看不到效果。
这是因为 backgroundColor 指的窗体背景颜色,而不是页面的背景颜色,即窗体下拉刷新或上拉加载时露出的背景。在电脑的模拟器中是看不到这个动作的,所以会让人误以为这个配置是无效的。
如果要设置页面背景颜色,得在 wxss 中自定义样式,如下:
page {
background-color: #eee;
}

分类至 随笔
0条评论

关于HTTP协议,一篇就够了

HTTP协议是Hyper Text Transfer Protocol(超文本传输协议)的缩写,是用于从万维网(WWW:World Wide Web )服务器传输超文本到本地浏览器的传送协议。

HTTP是一个基于TCP/IP通信协议来传递数据(HTML 文件, 图片文件, 查询结果等)。

HTTP是一个属于应用层的面向对象的协议,由于其简捷、快速的方式,适用于分布式超媒体信息系统。它于1990年提出,经过几年的使用与发展,得到不断地完善和扩展。目前在WWW中使用的是HTTP/1.0的第六版,HTTP/1.1的规范化工作正在进行之中,而且HTTP-NG(Next Generation of HTTP)的建议已经提出。

HTTP协议工作于客户端-服务端架构为上。浏览器作为HTTP客户端通过URL向HTTP服务端即WEB服务器发送所有请求。Web服务器根据接收到的请求后,向客户端发送响应信息。

分类至 网络应用
0条评论

MySQL 5.7 完美的分布式事务支持

分布式事务通常采用2PC协议,全称Two Phase Commitment Protocol。该协议主要为了解决在分布式数据库场景下,所有节点间数据一致性的问题。在分布式事务环境下,事务的提交会变得相对比较复杂,因为多个节点的存在,可能存在部分节点提交失败的情况,即事务的ACID特性需要在各个数据库实例中保证。总而言之,在分布式提交时,只要发生一个节点提交失败,则所有的节点都不能提交,只有当所有节点都能提交时,整个分布式事务才允许被提交。

分布式事务通过2PC协议将提交分成两个阶段:
prepare;
commit/rollback

第一阶段的prepare只是用来询问每个节点事务是否能提交,只有当得到所有节点的“许可”的情况下,第二阶段的commit才能进行,否则就rollback。需要注意的是:prepare成功的事务,则必须全部提交。

分类至 MySQL
0条评论

NetBeans IDE 配置 Less

1、安装Less
第一种方法:先安装node.js,然后使用npm命令安装less:npm install -g less
具体参考Less.js的官网:http://lesscss.org/
第二种方法:直接下载第三方集成安装包(自带node.js):https://github.com/duncansmart/less.js-windows/releases
2、路径配置
打开 NetBeans IDE 的菜单“工具--选项”,配置Less路径
3、参数配置
打开项目属性窗口,配置监视输入输出路径都为“.”(先删除默认项再点击添加),配置编译参数“--include-path=./”
4、其他参数
如果希望编译后的css文件体积最小化(自动去掉空白字符),加入参数 -x 即可,即配置编译参数“--include-path=./ -x”。更多参数请参考命令 lessc -h 获取。

分类至 随笔
0条评论

win10系统docker安装lnmp环境

1、创建目录
首先,位于D盘分别创建用于存放配置文件和数据文件的目录:
D:\dnmp
D:\dnmp\conf
D:\dnmp\html
D:\dnmp\mysql
D:\dnmp\redis
2、安装mysql
安装 mysql 5.7.25 版本,指令如下:
docker run -d --name mysql -v D:\dnmp\mysql:/var/lib/mysql -p 3306:3306 -e MYSQL_ROOT_PASSWORD=123456 mysql:5.7.25
...

分类至 Linux
0条评论