收藏
回答

图片使用绝对定位相对定位怎么一起使用?

最近需要做一个抽奖翻牌的动画显示如下:

<view class="imgbox">
      <view wx:for="{{datalist}}" wx:key="key" data-index="{{index}}" bindtap="luck">
        <view class="box b1">
          <image class="copyrightimg" src="{{item.copyrightimg}}"></image>
        </view>
        <view  class="box b2" >
          <image class="copyrightimg" src="{{item.copyrightimg_1}}"></image>
          <view class="number">{{item.number}}</view>
        </view>
      </view>
    </view>
想让他两张图片重合所有b1使用了绝对定位,但是翻页图片需要设置底下有数字故b2设置了相对定位
.box {
  transition: all 1s;
  backface-visibility: hidden;
}


.b1 {
  position: absolute;
}


.b2 {
  position: relative;
}
 但是就显示成翻页在上了


我想显示第一张该怎么调整 我是做后端的 前端小白求抢救... 片段

https://developers.weixin.qq.com/s/iu2eIlmF7ueM

回答关注问题邀请回答
收藏

2 个回答

  • 子不语
    子不语
    2020-01-13

    不是很懂你的 b1 为什么要用绝对定位,你看看这个代码片段

    https://developers.weixin.qq.com/s/Rh4edlmY73eR

    2020-01-13
    有用
    回复 12
    • 唏嘘
      唏嘘
      2020-01-13
      默认就是position: relative;   你还加他干啥
      2020-01-13
      回复
    • 唏嘘
      唏嘘
      2020-01-13
      他只要加个z-index就行
      2020-01-13
      回复
    • 唏嘘
      唏嘘
      2020-01-13
      哎呀  是static  丢脸了  哈哈哈
      2020-01-13
      1
      回复
    • 子不语
      子不语
      2020-01-13回复唏嘘
      害,我决定再给你点个赞
      2020-01-13
      回复
    • 唏嘘
      唏嘘
      2020-01-13回复子不语
      啧  你这瓜皮
      2020-01-13
      回复
    查看更多(7)
  • 唏嘘
    唏嘘
    2020-01-13

    你要啥效果 不是很懂你说的

    2020-01-13
    有用
    回复 9
    • 猿猿猿ಠ_ರೃ树林
      猿猿猿ಠ_ರೃ树林
      2020-01-13
      就是两张图片重合一块 我想弄个抽奖那种翻牌动画来着 但是要反面的图片要动态显示获得的数字所以又使用了相对定位 然后反面的显示在上面了,我想要正面显示在上面点击翻牌显示反面...
      2020-01-13
      回复
    • 唏嘘
      唏嘘
      2020-01-13回复猿猿猿ಠ_ರೃ树林
      .b1 {
        position: absolute;
        z-index: 99;
      }
      2020-01-13
      1
      回复
    • 唏嘘
      唏嘘
      2020-01-13回复猿猿猿ಠ_ರೃ树林
      改下 b1样式就行  z-index就是等级级别  级别越高越显示在前面
      2020-01-13
      回复
    • 猿猿猿ಠ_ರೃ树林
      猿猿猿ಠ_ರೃ树林
      2020-01-13
      谢谢指教!
      2020-01-13
      回复
    • 拾忆
      拾忆
      2020-01-13
      我就试试

      --↓↓👍点赞是回答的动力哦

      2020-01-13
      回复
    查看更多(4)
登录 后发表内容
问题标签