swiper中苹果设置position:relative无效
发布于 6 年前 作者 xiaping 959 次浏览 来自 问答

在swiper组件中，IOS给组件添加相对定位无效，导致组件item绝对定位无法在组件中，溢出隐藏失效，swiper-item超出swiper，border-radius效果无法实现。

安卓中效果：

苹果中效果：

开发工具中：

代码片段：

   <view class="bannerBar">
       <view class="banner-box">
           <swiper class="banner" autoplay indicator-dots indicator-color="#fff" indicator-active-color="#F5A623" interval="6000" duration="500" current="0">
               <swiper-item wx:for="{{3}}" wx:key="ban-box">
                   <image mode="widthFix" src="/images/banner/banner@{{index + 1}}.jpg">image>
               swiper-item>
           swiper>
       view>
   view>
/*  Banner  */
.bannerBar {
   width: calc(100% - 60rpx);
   height: 350rpx;
   padding: 30rpx;
}
.banner-box {
   width: 100%;
   height: 100%;
   border-radius: 10rpx;
   box-shadow: 0 0 50rpx rgba(0, 0, 0, 0.2);
   overflow: hidden;
   position: relative;
}
.banner {
   width: 100%;
   height: 100%;
   border-radius: 10rpx;
   overflow: hidden;
   position: relative;
}
2 回复

问题解决了吗

昨天发了一个border-radius跟box-shadow共存也会导致溢出隐藏失效的帖子，但是后来将阴影加到外部盒子就没问题了。

回到顶部