如何添加一键拨号悬浮按钮?

1854次阅读

swan部分(放在每个swan页面最后),图片最好自己下载上传到自己的站点,再修改下面的图片地址:

<view class="tel__wrap">

    <button class="button10" bindtap="calling_tel">

<image class="tel_image" src="https://static.51jiancong.com/wxapp/936/images/20190612/20190612085712_16199.png"></image>

</button>

</view>



css部分(只需放在index.css最后的空白位置即可):

.tel__wrap {

 position:fixed;right:26rpx;bottom:30rpx;z-index:999;

}

.tel__wrap .tel_image {

 width:80rpx;height:80rpx;visibility:visible;opacity:0.6;

}

.tel__wrap .button10 {

 visibility:hidden;margin:0;

}


js部分(放在每个js页面最后的   });  前面):

 ,calling_tel: function (e) {

    let mobile = e.currentTarget.dataset.id;

    if (!mobile) {

      mobile = app.globaldata.settings.cfg_kefu_tel;

    }

    swan.makePhoneCall({

      phoneNumber: mobile,

      success: function () {

        console.log("拨打电话成功!")

      },

      fail: function () {

        console.log("拨打电话失败!")

      }

    })

  }

本文由夫唯团队编辑,如发现错误,欢迎通过客服微信反馈。

夫唯于2024年12月停止百度SEO研究和培训。道别信: 夫唯:再见了百度SEO!

2025年1月正式启动Google SEO培训课程,一千零一夜带领大家一起出海。

感兴趣的同学,请添加招生客服小沫微信:seowhy2021。 微信扫码添加客服人员

我们的目标:让大家独立站出海不再“望洋兴叹”。

Processed in 1.351256 Second , 485 querys.