微信小程序官方api中提到的微信客服，是一个固定的组件，图标样式固定，大小最多27px 很明显这个是不能满足我们各种奇葩需求的。下面提供一个野蛮的自定义方法。

比如做一个这样的按钮:

图标用自定义的，并且点击整个按钮区域都能跳转微信客服

第一步：在按钮中放N个contact-button标签，尽量铺满容器，按钮用relative定位，contact-button用absolute定位

第二步：将contact-button样式设置纯透明 opacity: 0;(o゜▽゜)o☆[BINGO!]

微信小程序自定义微信客服按钮的更多相关文章

  1. 小程序中添加客服按钮contact-button

    小程序的客服系统,是微信做的非常成功的一个功能,开发者可以很方便的通过一行代码,就可实现客服功能. 1. 普通客服按钮添加 <button open-type='contact' session ...

  2. 微信小程序 功能函数 客服

    <view> <view class='btn-img'> <image class='image-full' src='../../imgs/index/tab6.pn ...

  3. 微信小程序 自定义单选复选按钮组的实现(用于实现购物车产品列表功能)

    (一)单选按钮组 模型图如下: index.js Page({ data: { parameter: [{ id: 1, name: '银色' }, { id: 2, name: '白色' },{ i ...

  4. 【微信小程序】：客服消息教程

    1.本教程完全链接W3Cschool的教程,已经讲的非常清晰和透彻. 2.链接:https://www.w3cschool.cn/weixinapp/weixinapp-api-custommsg-c ...

  5. 微信小程序自定义Tabber，附详细源码

    目录 1,前言 2,说明 3,核心代码 1,前言 分享一个完整的微信小程序自定义Tabber,tabber按钮可以设置为跳转页面,也可以设置为功能按钮.懒得看文字的可以直接去底部,博主分享了小程序代码 ...

  6. 微信小程序自定义 tabbar

    一定的需求情况下,无法使用小程序原生的 tabbar 的时候,需要自行实现一个和 tabbar 功能一模一样的自制组件. 查阅了海量的博客和文档之后,亲自踩坑.总结了三种在不使用微信小程序原生 tab ...

  7. 微信小程序——自定义导航栏

    微信头部导航栏可能通过json配置: 但是有时候我们项目需求可能需要自定义头部导航栏,如下图所示: 现在具体说一下实现步骤及方法: 步骤: 1.在 app.json 里面把 "navigat ...

  8. 微信小程序自定义弹窗wcPop插件|仿微信弹窗样式

    微信小程序自定义组件弹窗wcPop|小程序消息提示框|toast自定义模板弹窗 平时在开发小程序的时候,弹窗应用场景还是蛮广泛的,但是微信官方提供的弹窗比较有局限性,不能自定义修改.这个时候首先想到的 ...

  9. 微信小程序-自定义底部导航

    代码地址如下:http://www.demodashi.com/demo/14258.html 一.前期准备工作 软件环境:微信开发者工具 官方下载地址:https://mp.weixin.qq.co ...

随机推荐

  1. JS IE 打开本地exe程序

    例: try{ //新建一个ActiveXObject对象 var exe = new ActiveXObject("wscript.shell"); var exePath = ...

  2. CRC8校验

    static u8 crccheck(u8* p,u8 len) //CRC校验,返回CRC检验值 { u8 bit0,cbit,i,j,byte,temp; temp = ; ; j < le ...

  3. sqlalchemy操作----建表 插入 查询 删除

    ... #!_*_coding:utf-8_*_ #__author__:"Alex huang" import sqlalchemy from sqlalchemy import ...

  4. Mysql 复制工作原理

    数据库配置的时候,一定要开启二进制日志,如果开始没开启后来再想开启的话,必须重启. 基于日志点的复制 备份数据库工具 ----------------------------------------- ...

  5. 纯css3实现文字间歇滚动效果

    场景: 假设有4条数据或者标题,视口中只显示两条,采用每次向上滚动一条数据来展示所有的数据.效果如图: 用JavaScript也很容易实现,但是需要操作DOM,可以参考这篇博客.考虑到项目中经常使用V ...

  6. [原创] 抛弃vboot不格盘用Grub4dos+Winvblock或Firadisk安装Ghost版XP到VHD，轻松RAMOS!

    [原创] 抛弃vboot不格盘用Grub4dos+Winvblock或Firadisk安装Ghost版XP到VHDhttp://bbs.wuyou.net/forum.php?mod=viewthre ...

  7. 【RPC】使用Hessian构建RPC的简单示例

    服务接口和实现 public interface HelloService { // 服务方法 String sayHello(String name); } public class HelloSe ...

  8. nodejs选择JavaScript作为开发语言，是因为一般的开发语言的标准库都是带有IO模块的，并且通常这个 模块是阻塞性的，所以nodejs选择了没有自带IO模块的Javascript

    Javascrip本身不带IO功能,nodejs选择JavaScript作为开发语言,是因为一般的开发语言的标准库都是带有IO模块的,并且通常这个 模块是阻塞性的,所以nodejs选择了没有自带IO模 ...

  9. JSON: 介绍、应用

    ylbtech-JSON:  介绍.应用 JSONP(JSON with Padding)是 JSON 的一种“使用模式”,可以让网页从别的域名(网站)那获取资料,即跨域读取数据. 为什么我们从不同的 ...

  10. python装饰器1

    目的:在不修改原来函数代码的前提下,使用这个功能,可以使得之后这个函数被调用时增加额外的功能. #2.定义装饰器 def deco (fun): print "i am deco,i can ...