translate3d在安卓无效的问题
2016-05-10 15:11
204 查看
需要实现这样一个需求,滑动手机屏幕切换图片。手指移动的时候下一张图片跟着移动。手指离开的时候下一张图片移动到屏幕中央。
实现的过程有这样一个片段:
手指移动的时候下一张图片的transform:translate3d(0,[手指移动距离px],0);
手指离开的时候下一张图片的transform:translate3d(0,-100%,0);
这样导致translate的单位从px换成%,在pc和ios上能正常运行,在安卓上没有动画效果
如果将手指离开后translate3d换成translate,可以解决问题。Translate在安卓上可以转化px和%;
如果把手指移动时的translate3d换成translate,在安卓上会卡顿。因为3d变换会强制手机开启加速;
Css里transition需要写成: -webkit-transition:-webkit-transform 0.2s linear;才有效果。
相关文章推荐
- VS2015官方下载地址(个人免费版)
- jsp中执行onclick会刷新一次页面的问题
- PagerSlidingTabStrip介绍及使用,让ViewPager更绚丽
- redis学习笔记(14)---redis基本命令总结
- scullpipe驱动程序测试(使用x86平台)
- Servlet & JSP - Filter
- ulimit -n修改单进程可打开最大文件数目
- #android# service stopself() stopservice()
- Web项目部署到tomcat
- iOS TextField正则表达式输入验证 NSPredicate谓词匹配
- Boost库各个版本下载地址
- iOS巅峰之layoutSubviews在什么时候调用
- poj1067 威佐夫博弈
- Simple 主题不会自动显示错误消息,怎么办?
- 驱动模块编译平台的选择
- HTML5之2D物理引擎 Box2D for javascript Games 系列 第一部分
- jQuery知识点:attr与prop的区别
- 关于 Android 进程保活,你所需要知道的一切【转】
- DevOps 发展融合运维可视化
- Retrofit Rxjava 实现图片下载、保存并展示