zoukankan      html  css  js  c++  java
  • 小程序 菜单标题滑动底部

    .weui-navbar__slider {
    position: absolute;
    content: " ";
    left: 0;
    bottom: 0;
    70rpx;
    height: 3px;
    ">;
    -webkit-transition: -webkit-transform 0.3s;
    transition: -webkit-transform 0.3s;
    transition: transform 0.3s;
    transition: transform 0.3s, -webkit-transform 0.3s;
    }
    <view class="weui-navbar__slider" style="left: {{sliderLeft}}px; transform: translateX({{sliderOffset}}px); -webkit-transform: translateX({{sliderOffset}}px);"></view>
     
    wx.getSystemInfo({
    success: function (res) {
    console.log(res.windowWidth)
    console.log(that.data.tabs.length)
     
    let sliderWidth = that.data.sliderWidth;
    console.log(sliderWidth)
    that.setData({
    sliderLeft: (res.windowWidth / that.data.tabs.length - sliderWidth) / 2

    });
    }
    });
     
    // 菜单控制函数
    actsureFn: function(e) {
    let that = this;
    let index = e.currentTarget.dataset.index;
    let actsure = index;
    let requestNum1 = this.data.requestNum1;
    let requestNum2 = this.data.requestNum2;

    let shopsAll_zwt = that.data.shopsAll_zwt;
    // console.log(that.data.shopsAll_zwt)

    if (requestNum1 > 0 && actsure == 0) {
    that.homeFn()
    that.homeFn2()
    requestNum1--;
    that.setData({
    requestNum1
    })
    }
    this.setData({
    actsure,
    sliderOffset: e.currentTarget.offsetLeft,
    })
    },
     
     
     
    data{
    tabs:[1,2],
    sliderWidth:145,
    sliderLeft: 0,
    sliderOffset: 105,
  • 相关阅读:
    Linux -- 查看是否安装了指定的包
    linux -- 部署java服务器(1) linux安装jdk
    spring boot -- 接收文件接口
    vue3 --相对于vue2的改变T1档次
    243交换输出
    24416进制的简单运算
    7街区最短路径问题
    206矩形的个数
    33蛇形填数
    273字母小游戏
  • 原文地址:https://www.cnblogs.com/dianzan/p/9371495.html
Copyright © 2011-2022 走看看