在使用transform时遇到一个问题

Question

d商品详情代码
function switchProductShow(){
            
           
            $(".product-list").css("transform","translateX(-100%) rotateX(0deg) rotateY(0deg)")
            $(".mobile").css("transform","translateX(-100%) rotateY(90deg)")

            }

close函数
function switchProductClose(){

            $(".product-list").css("transform","rotateX(0deg) rotateY(-90deg) translateX(0)")
            $
            $(".mobile").css("transform","rotateX(0deg) rotateY(0deg) translateX(0)")
            }

结果在ios10-6splus的时候出现这个问题，如图，其他机型没有测试
点详情时，

![图片上传中...]

点击close返回时

这个东西露出了，最终会在导航栏的下面，rotateY的缘故？
预览地址

Answer 1

Transform的渲染在ios上和chrome有差异,你nav的dom顺序要放在列表之后,而且层级要高一些.