小程序
小游戏
企业微信
微信支付
扫描小程序码分享
像这样图片上的完成按钮怎么做啊
我做出来的是这样的,不能覆盖在图片上,求大佬帮帮忙
5 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
position: fixed:
bottom: 100rpx;
z-index: 999;
你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。
用绝对定位,或者fixed定位。把按钮和图片的代码放出来,wxml和wxss的,帮你改改
<camera style="height: {{wh}}px; width:100%;" flash="off" device-position="back" wx:if="{{isShowPic===false}}">
<view class="f1">
<view >
<van-icon name="circle" size="50px" bindtap="takePhoto"/>
</view>
</camera>
<view wx:else class="f2">
<image src="{{src}}" style="height: {{wh}}px; width: 100%;" mode='aspectFill'/>
<button type="primary">完成</button>
<button type="primary">重拍</button>
.f1 {
height: 100%;
display: flex;
justify-content: space-around;
position: absolute;
width: 100%;
top: 600px;
}
.f2 {
<view class="f2" style="position: relative;">
<image style="height: 100px; width: 100%;" mode='aspectFill'/>
<button type="primary" style="position: absolute; top: 0; left: 0;">完成</button>
<button type="primary" style="position: absolute; top: 0; right: 0;">重拍</button>
用定位的absolute或fixed以及z-index设置图层优先级,即可让按钮脱离文档流出现在你想出现的地方,通过调整left和top
.button{ position:fixed; bottom:50rpx; z-index:99; }
在 wxss 文件里写,位置都是可以调的。
也可以用 cover-view 这样的原生组件。https://developers.weixin.qq.com/miniprogram/dev/component/cover-view.html
你好,可以写一个代码片段吗
我的按钮是可以放在图片之上的
关注后,可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
position: fixed:
bottom: 100rpx;
z-index: 999;
https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html
用绝对定位,或者fixed定位。把按钮和图片的代码放出来,wxml和wxss的,帮你改改
<camera style="height: {{wh}}px; width:100%;" flash="off" device-position="back" wx:if="{{isShowPic===false}}">
<view class="f1">
<view >
<van-icon name="circle" size="50px" bindtap="takePhoto"/>
</view>
</view>
</camera>
<view wx:else class="f2">
<image src="{{src}}" style="height: {{wh}}px; width: 100%;" mode='aspectFill'/>
<button type="primary">完成</button>
<button type="primary">重拍</button>
</view>
.f1 {
height: 100%;
display: flex;
justify-content: space-around;
position: absolute;
width: 100%;
top: 600px;
}
.f2 {
height: 100%;
width: 100%;
top: 600px;
}
<view class="f2" style="position: relative;">
<image style="height: 100px; width: 100%;" mode='aspectFill'/>
<button type="primary" style="position: absolute; top: 0; left: 0;">完成</button>
<button type="primary" style="position: absolute; top: 0; right: 0;">重拍</button>
</view>
用定位的absolute或fixed以及z-index设置图层优先级,即可让按钮脱离文档流出现在你想出现的地方,通过调整left和top
.button{ position:fixed; bottom:50rpx; z-index:99; }
在 wxss 文件里写,位置都是可以调的。
也可以用 cover-view 这样的原生组件。https://developers.weixin.qq.com/miniprogram/dev/component/cover-view.html
你好,可以写一个代码片段吗
我的按钮是可以放在图片之上的