收藏
回答

cover-view的perspective属性无法生效

问题模块 框架类型 问题类型 操作系统 操作系统版本 手机型号 微信版本
客户端 小程序 Bug Android 8.1.0 小米6X 6.7.3

- 当前 Bug 的表现




- 希望在<camera>标签上,做透视变换,使用了perspective这个参数,在PC模拟器上没问题,在手机上就cover-view就出问题了


- 最简复现 Demo


js:

IconList: [

{ x: 10, y: 0 },

{ x: 10, y: -100 },

{ x: 10, y: -200 },

{ x: 10, y: -300 },

{ x: 10, y: -400 },

{ x: 10, y: -500 },

{ x: 10, y: -600 },

{ x: 10, y: -700 },

{ x: 10, y: -800 },

{ x: 10, y: -900 },

],


wxml:

<camera device-position="back" flash="off" binderror="error" class="bg">

    <cover-view class="div1">

        <cover-view class="div2">          

            <block wx:for="{{navIconList}}">

                <cover-view class='div_icon' style='top:{{item.y + 100}}rpx;left:{{item.x  }}rpx'></cover-view>

            </block>

        </cover-view>

    </cover-view>

</camera>


wxss:

.div1

{

position: relative;

height: 150px;

width: 150px;

margin: 50px;

padding:10px;

border: 1px solid black;

perspective:1000;

-webkit-perspective:150; /* Safari and Chrome */

}


.div2

{

padding:50px;

position: absolute;

border: 1px solid black;

background-color: yellow;

transform: rotateX(40deg);

-webkit-transform: rotateX(40deg); /* Safari and Chrome */

}


.div_icon{

position: absolute;

width: 40px;

height: 40px;

background-color: blueviolet;

z-index: 999;

}





最后一次编辑于  2018-12-04  (未经腾讯允许,不得转载)
回答关注问题邀请回答
收藏

1 个回答