首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >微信小程序添加悬浮在线客服会话按钮

微信小程序添加悬浮在线客服会话按钮

作者头像
ytkah
发布于 2018-09-28 07:03:08
发布于 2018-09-28 07:03:08
3.8K00
代码可运行
举报
文章被收录于专栏:ytkahytkah
运行总次数:0
代码可运行

  微信为小程序提供客服消息能力,小程序用户可以方便快捷地与小程序服务提供方进行沟通,并且已经做成了组件的形式,直接就可以调用。客服会话按钮,用于在页面上显示一个客服会话按钮,用户点击该按钮后会进入客服会话。那么如何自定义成悬浮客服会话按钮呢?随Z5Win一起来看看

1.我们可以定义contact-button的样式,加一个class。这个客服组件可以放在一个固定模板里,方便每个页面都调用到。

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<view>
	<contact-button class="img-plus-style zindex100 yc"></contact-button>
	<image src="../../images/kefu.png" class="img-plus-style"></image>
</view>

2.在app.wxss或其他文件里增加样式

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
.img-plus-style {
height: 70rpx;
width: 70rpx;
position: fixed;
bottom: 200rpx;
right: 13rpx;
opacity: 0.7
}
.zindex100{z-index: 100}
.yc{opacity: 0}

3.上传自定义的客服图标

4.当然你也可以调用拨打电话的功能,只要在图片里加一个bindtap=”calling”属性

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<view>
	<contact-button class="img-plus-style zindex100 yc"></contact-button>
	<image src="../../images/kefu.png" class="img-plus-style" bindtap="calling"></image>
</view>

然后再定义一个calling的js function,比如在tel.js文件里

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
calling: function () {
wx.makePhoneCall({
phoneNumber:10086,
})
}

微信小程序添加悬浮在线客服会话按钮就实现了,感兴趣的朋友可以试试

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2018-08-27 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
《计算机组成原理》| 第六章 计算机的运算方法-运算器 知识梳理
             (1111…1) -2n+1 ≤x ≤2n-1 (0111…1)
Twcat_tree
2022/11/30
1K0
《计算机组成原理》| 第六章 计算机的运算方法-运算器 知识梳理
计算机组成原理 数据的表示与运算
如果我们不采用无符号数,那么其实我们能够表示的数据范围就会发生改变其实能够真正表示数据的是不是只有7位了,还有一位我们需要作为符号位。
onenewcode
2024/01/17
5481
【计组不挂科】计算机组成第二章< 数据的表示&运算方法&运算部件 >习题库(选择题&判断题&填空题)(含答案与解析)
A.指令和数据都以十进制形式存放 B.指令和数据都以二进制形式存放 C.指令以二进制形式存放,数据以十进制形式存放 D.指令以十进制形式存放,数据以二进制形式存放
YY的秘密代码小屋
2024/11/30
2730
计算机组成原理-运算方法之数据格式
数据格式 先说下数据格式,在选择计算机数的表示方式时,需要考虑以下几个因数: 要表达的书的类型(小数,整数,实数,复数) 可能遇到的数值范围 数值精度 数据存储和处理所需要的硬件代价 计算机中常用的数据表示格式有两种,一是定点格式,二是浮点格式。 定点数的表示方式 所谓定点格式,即约定机器中所有数据的小数点位置是固定不变的。通常将数据表示成纯小数或纯整数。 用一个n+1位数来表示一个定点数X,其中一位Xn用来表示数的符号,其余数代表他的量值。为了将整个n+1位统一处理,符号位Xn放在最左位置,并用数值0和1
李郑
2018/02/28
1.1K0
计算机组成原理-运算方法之数据格式
干货!计算机组成原理简介
未名编程
2024/10/12
4500
【考研408&计算机组成原理】数值表示和运算之快速数值转换
目前暂时只接入了微信,如果大家对这个问答系统感兴趣的话可以在我的主页里找到我的微信号
苏泽
2024/06/28
1990
【考研408&计算机组成原理】数值表示和运算之快速数值转换
漫谈计算机组成原理(十)浮点数运算
浮点数和定点数一样,都是计算机中数据的存储形式。定点数我们可以理解成纯小数或者纯整数,但是实际上在计算机中参与运算的数字并非都是定点数。比如,有些数据过大,比如2^100^这样的数据,如果写成二进制的形式,寄存器肯定是无法放下的。于是就有了浮点数这种数据。 本文主要讲述浮点数的概念、浮点数的规格化,以及浮点数的各种运算。
roobtyan
2019/02/21
9.9K0
漫谈计算机组成原理(十)浮点数运算
计算机组成原理--数据的表示及其运算和运算器(附考研题目)
8421BCD用于表示字符型数据:电话号码、学号等,不用于运算 大小比较: 原码:正数越大值越大,负数越大值越小 移码:看着越大值越大 00000
风骨散人Chiam
2020/10/28
7100
数值问题
计算机里面关于数值的处理自有一套体系理论,与现实生活中我们所习惯使用的不太一样。如果对其不了解,在使用计算机的过程中便可能发生一些意想不到的错误。
rand_cs
2023/12/10
4180
计算机组成原理 --- 数据信息的表示
1) 根据补码的定义求补码。 [x]补码 = 模 + x(mod模) ,x可正可负,利用这种方法需要事先求出 模的值。
杨鹏伟
2020/09/10
2.4K0
计算机数据表示方法及工业标准IEEE754讲解教程
今天在这里和大家记录一下在计算机系统中各种数据的表示方式以及工业标准IEEE754的使用方法。
灰小猿
2020/09/23
8760
计算机数据表示方法及工业标准IEEE754讲解教程
【码制】原码反码补码移码浮点数
学C语言的时候一定会用到printf("%d",a); 有的课程称%d为“占位符”,非常形象:%d替a占位,输出的时候a的值会替换%d的内容。 但也有课程称之为“转换规范”,官方称之为“format specifiers”格式说明符。 以我目前的文化水平,我更倾向于“转换规范”。 因为计算机中的数据都是以01的形式存储,你不知道这串01是什么意思。 以char类型的变量a为载体举个例子:
WuShF
2023/10/23
9720
【码制】原码反码补码移码浮点数
Java 基本类型的各种运算,你真的了解了么?
在上一篇文章 很清晰!带你图解 Java 程序的结构,变量和类型 里,我们知道 Java 的基本类型分整型类型,浮点型类型和布尔类型三种。那针对不同的类型,Java 提供的运算能力也是各有不同,本篇文章就分析下 Java 基本类型里的各种运算是怎么回事。
蜗牛互联网
2021/04/08
8880
深入理解计算机系统 第二章 笔记
大多数计算机使用 8位 (1byte) 作为最小的可寻址的内存地址 机器级程序将内存视为一个非常大的字节数组,称为 虚拟内存 内存的每个字节有唯一标识,称为 地址,所有可能地址的集合称位 虚拟地址空间
MashiroT
2022/10/28
3.4K0
深入理解计算机系统 第二章 笔记
计算机组成原理核心知识点总结&面试笔试要点[通俗易懂]
  作为一名计算机专业的学生,计算机组成原理、计算机网络、操作系统这三门课程可以说是专业核心基础课,是至关重要的,其内容是一名合格的coder所必备的知识集;非科班出身的程序员要是想要有所提升,也需要认真学习这三门课程,可以快速形成计算机知识的结构体系,理解计算机底层原理,在工作实践中可以借鉴优秀的设计;而且很多互联网公司在笔试和面试中都会涉及到这三门课程的知识点,因此我通过视频学习对这三门课程就行复习巩固,同时分三篇博客记录总结。
全栈程序员站长
2022/07/28
1.4K0
计算机组成原理核心知识点总结&面试笔试要点[通俗易懂]
计算机组成原理知识点
计算机体系结构(Computer Architecture)主要研究硬件和软件功能的划分,确定硬件和软件的界面,哪部分功能由硬件系统来完成,哪部分功能由软件系统来完成。
全栈程序员站长
2022/09/05
1.1K0
计算机组成原理期末复习90分以上选择填空大题总考点
闲来无事,将复习时整理的部分资料push来,纯手打,部分错误根据自身基础忽略即可,不影响阅读。
全栈程序员站长
2022/07/22
6610
计算机组成原理期末复习90分以上选择填空大题总考点
漫谈计算机组成原理(九)定点数及定点数的运算
在计算机中,小数点并没有用专门的器件去表示,而是按照一种约定的方式,统一存储在寄存器单元中的。算数逻辑运算单元(ALU)是CPU的组成部分,负责算数和逻辑的运算。那么,ALU究竟是如何工作的呢? 这就是本文主要探讨的内容:
roobtyan
2019/02/21
5.3K0
漫谈计算机组成原理(九)定点数及定点数的运算
计算机组成原理-大题
Cn-1(次高位进位)SF(Sign Flag)符号标志输出结果的符号信息——ZF(Zero Flag)零标志ZF = 1表示 输出结果为0——CF(Carry Flag)进位标志 (无符号数溢出标志)运算结果超出了无符号数的表示范围,产生进位Cout
黎鹤舞
2024/12/03
2050
计算机组成原理-大题
聊聊计算机的数字表示方法(下)
上篇已经讲了原码、反码和补码的出现解决了计算机对整数的存储和计算问题,而小数的存储和计算又是另外一套机制,对于人类而言,整数和小数的计算一样简单,然而对于计算机来说小数运算比整数运算要复杂的多。本文从浮点数原理出发,聊聊浮点数的精度问题,对网上的一些结论进行回答。
一个无聊的人
2022/08/26
1.5K0
聊聊计算机的数字表示方法(下)
推荐阅读
相关推荐
《计算机组成原理》| 第六章 计算机的运算方法-运算器 知识梳理
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档