WAP端 经验记录2

Posted 2020-07-18 Hello World

1. LightboxV2 插件

点击A 应该关闭弹层的效果，但是 SAMSUNG 手机上原生浏览器上，看上去不会关闭却跳转了，但当点击回退按钮的时候就会看见弹层已经消失(其实之前的关闭效果已经记录了)
UC浏览器上点击A 能看到 弹层关闭，因为它的click事件 只比 touchend事件慢了一点点

ios7.0 能看到弹层关闭再跳转，IOS8.0看不到弹层关闭再跳转，但是当回退的时候都是关闭的

 

2. chrome 中文版下 不能设置字体小于 12px, 但是可以用如下的属性去让它缩放
-webkit-transform: scale(0.775384615384615);

 

3.
safari ios8 下不支持 new Date(‘1440666951116‘)
但是可以 new Date(1440666951116) 或 new Date(2015,8,12,10,10,40)

IE8 支持写法 new Date(1440666951116) 或 new Date(2015,8,12,10,10,40)

 

4.
当一个元素用了 -webkit-transform: rotate(20deg); 它的层级z-index在某些浏览器下会很高，用下面的属性让其他元素层级比它高。

-webkit-transform: translateZ(0);
-webkit-transform: rotateX(0);

 

5. uglifyjs 压缩代码
cd D:\Users\zhengming\Desktop
uglifyjs lightbox_v2.js -m -o lightbox_v2.min.js // 混淆压缩
uglifyjs lightbox_v2.js -o lightbox_v2.min.js // 普通压缩

 

6 fiddler 模拟POST的 404请求:

METHOD:POST REGEX:(?insx)http://youxi36-wap.stg2.24cp.com/.+
*404-SESSION_40

7 如何居中

position: fixed;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%, -50%);

这个在某些手机 默认浏览器没有问题，但内嵌的APP里面 -webkit-transform: translate(-50%, -50%); 不起作用。

修复的办法就是改成 position: absolute;

 

8   zepto-1.1.6.js
Zepto(document).height() 如果没有内容会是0,

　　Zepto里代码为: document.documentElement.scrollHeight，所以得改成

　　Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);

Zepto(window).width() 没有去掉浏览器滚动条的宽度

　　所以若是PC取宽度代码（参考 jquery-1.11.3.js）： document.documentElement["clientWidth"]
Zepto(window).height() 没有去掉浏览器滚动条的宽度

　　所以若是PC取宽度代码（参考 jquery-1.11.3.js）： document.documentElement["clientHeight"]

 

9 userAgent
iphone6 plus
"Mozilla/5.0 (iPhone; CPU iPhone OS 8_0 like Mac OS X) AppleWebKit/600.1.3 (Khtml, like Gecko) Version/8.0 Mobile/12A4345d Safari/600.1.4"

小米
mozilla/5.0(linux; u; android4.1.1; zh-cn; mi 2 build/jro03l)applewebkit/534.30(khtml, like gecko)version/4.0 mobile safari/534.30
xiaomi/miuibrowser/1.0