javascript - 为什么用zepto的swipeLeft时间改变translate的值在微信表现的特别卡顿?
阿神
阿神 2017-04-11 11:41:43
[JavaScript讨论组]
css:
.hotSingerwrap{
            width:7.48rem;
            height: 100%;
            position: absolute;
            top: 0;
            left: 0;
            transition-timing-function: cubic-bezier(0.1,0.57,0.1,1);
            transition-duration: 0ms;
            transform: translate(0px,0px);
}
js:
$("#hotSingerwrap").swipeLeft(function(){
    var a     = $(this).css("transform")
    var b   = a.split(",")[4];
    if (b>-365) {
        index--;
        $(this).css("transform","matrix(1, 0, 0, 1, "+index*50+",0)");
    }
})

在微信端特别卡顿,请问有什么解决办法没。求推荐做类似效果比较好用的插件

阿神
阿神

闭关修行中......

全部回复(1)
大家讲道理

因为Android微信性能很差的,处理这种运动都是非常卡顿。

优化有2个方向,一是设置translateZ的值,启用浏览器的gpu加速
而是采用节流的方式

所以一般都要采用节流方式,至于插件我还没遇到过,我都是自己写节流,节流之后不会卡顿,但是动画效果也不会太好。
关于节流的具体实现,这里贴个链接就好了,要详细说起来又可以写一篇文章了
https://keelii.github.io/2016/06/11/javascript-throttle/

实际中的解决方案就是在Android微信上劲量避免使用动画。

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号