美文网首页微信小程序
轮播图上添加不跟随滑动的标题

轮播图上添加不跟随滑动的标题

作者: 风规自远 | 来源:发表于2022-05-10 11:20 被阅读0次

    <view class='swiper-container'>

      <swiper class='swiper' style="z-index: 100;" indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" circular='true' duration="{{duration}}">

        <block wx:for="{{backgrounds}}" wx:key="unique">

          <swiper-item>

            <image class='swiper-item' src='{{item}}'></image>

          </swiper-item>

        </block>

      </swiper>

      <view class="title-css">

        <text style="color: white;font-size: 16px;font-weight:400;" >{{custname}}</text>

      </view>

    </view>

    .swiper-container {

      position: relative;

    }

    .swiper {

      height: 360rpx;

    }

    .swiper-container .swiper {

      height: 350rpx;

    }

    .swiper-item {

      width: 94%;

      margin-left: 3%;

      display: block;

      height: 100%;

    }

    .title-css {

      padding-left:30rpx;

      padding-bottom: 10rpx;

      position: absolute;

      bottom:0;

      left:0%;

      transform:translateX(0%);

      text-align:left;

    }

    相关文章

      网友评论

        本文标题:轮播图上添加不跟随滑动的标题

        本文链接:https://www.haomeiwen.com/subject/uarlurtx.html