微信小程序增加悬浮在线客服

摘要:
例如,在索引主页上添加客户服务代码,然后进行一键呼叫1。在index.wxss或app.wxss文件中,添加样式。img plus style{高度:70rpx;宽度:70rp;位置:固定;底部:220rpx;右侧:30rpx;效率:0.7}

例如在index首页增加客服代码及一键拨打电话

1、index.wxss或者app.wxss文件里增加样式

.img-plus-style {  
  height: 70rpx;  
  width: 70rpx;  
  position: fixed;  
  bottom: 220rpx;  
  right: 30rpx;  
  opacity: 0.7
}  
.img-plus-style1 {  
  height: 70rpx;  
  width: 70rpx;  
  position: fixed;  
  bottom: 130rpx;  
  right: 30rpx;   
  opacity: 0.7
}  
.zindex100{z-index: 100}
.yc{opacity: 0}

2、index.wxml文件增加代码

<view>  
<contact-button type="default-dark" size="20" session-from="weapp" class="img-plus-style zindex100 yc">
</contact-button>
<image src="../../image/xk_kefu.png" class="img-plus-style"></image> 
<image src="../../image/xk_tel.png" class="img-plus-style1" bindtap="calling"></image>
</view>

3、index.js增加 一键拨号

calling: function () {
      wx.makePhoneCall({
        phoneNumber: '10086', 
      })
    },

4、把两个图标放在image目录下

xk_kefu.png xk_tel.png

内容参考:http://www.xkmov.net/jiaocheng/xiaochengxu/s294.html

免责声明:文章转载自《微信小程序增加悬浮在线客服》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇Clipper库中文文档详解Linux服务器宕机案例第二则下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

微信小程序 发送模板消息的功能实现

背景 - 小程序开发的过程中,绝大多数会满足微信支付 - 那么,作为友好交互的体现,自然就会考虑到支付后的消息通知咯 - 所以,我的小程序项目也要求完成这个效果,so.分享一下自己的实现步骤,以方便道友们少踩点坑... 微信消息通知的区别: 1. 微信网页版、公众号的消息提醒 要求用户必须 "关注商家公众号",才支持消息的接收 并且还有个奇怪...

当微信小程序遇到AR(二)

当微信小程序遇到AR,会擦出怎么样的火花?期待与激动...... 通过该教程,可以从基础开始打造一个微信小程序的AR框架,所有代码开源,提供大家学习。 本课程需要一定的基础:微信开发者工具,JavaScript,Html,Css 第二章:基石-摄像头数据获取 【前情提要】 上一章,我们了解了微信小程序与AR相遇一些前因后果,同时也,罗列出来是要实现这样...

微信小程序实现node的自动打包上传代码

在平时的小程序开发过程中,可能会遇到下面这些小问题,虽然不影响开发过程,但是开发体验确会差一点,具体如下: 每次在编辑器中运行构建命令,第一次还需要手动打开微信开发者工具,打开指定项目 每次准备发布体验版时,需要先在本地打包,等待打包完成,在开发者工具中点击上传代码 那么怎么避免重复的操作,特别是比较频繁的发布场景,可能每天需要多次的等待及上传操作...

微信小程序IOS系统中,倒计时(setInterval函数)失效的问题

BUG在基础库1.1.0版本已经修复。先说结论:挂起(显示在聊天顶部)状态无法完美解决,息屏状态可以完美解决。本帖目的只是分享在碰到问题时的解决方法和思路。如果不能解决您的问题就非常抱歉。 ps:由于小程序一直在更新中,所以并不保证下面的方法长期有效。 息屏状态完美解决方法:1、适用场景:通过传入参数控制倒计时时间的页面。2、解决思路:在息屏和挂起的时候,...

微信小程序 button 组件

  button 组件 拥有强大的功能 自身可以拥有很多跟微信风格的样式,且是 表单 和 开放的能力 重要的 按钮   button 的属性:     size:  类型  字符串  按钮的大小       属性值:default  默认的           mini   小尺寸     type:  类型  字符串  按钮的样式类型       属性值...

同一微信开放平台下 unionid 作用。

UnionID 机制说明 如果开发者拥有多个移动应用、网站应用、和公众账号(包括小程序),可通过UnionID 来区分用户的唯一性,因为只要是 同一个微信开放平台账户下的移动应用、网站应用和公众账号(包括小程序),用户的UnionID是唯一的。 换句话说、同一用户,对同一微信开放平台下的不同应用、unionid是相同的。 小程序关联到同一个公众号下就...