精美底部营销通用型插件（客服+电话+微信）按钮

   因为做企业营销型站，需要底部加营销内容，包括客服，电话按钮，一键添加微信按钮，所以写了这个通用型插件

使用方法，把以下代码复制到网站底部即可运行：

  

<style>
@media only screen and (min-width:300px) and (max-width:1000px) {
	.mob-foot {
        display:block;
		overflow: hidden;
		position: fixed;
		bottom: 0;
		background-color: #2054a3;
		padding: 1rem 0;
		z-index: 9999;
		margin: 0 auto;
		width: 100%;
	}
}
@media only screen and (min-width: 1100px){
	.mob-foot {
        display:none;
	}

}
@media only screen and (min-width: 1100px){
  #copyContent{
      display:none;
  }

}

.mob-foot a {
    float: left;
    width: 33.33%;
    line-height: 3rem;
    font-size: 1.2rem;
    color: #f5f5f5;
    text-align: center;
    position: relative;
}
	.mob-foot a img {
		display: inline-block;
		vertical-align: middle;
		margin-right: .2rem;
		width: 18px;
	}
	
	element.style {
	}
	.mob-foot a:nth-child(2) {
		background: -webkit-linear-gradient(left,#ff6255,#ec0823);
		background: -o-linear-gradient(left,#ff6255,#ec0823);
		background: -moz-linear-gradient(left,#ff6255,#ec0823);
		background: linear-gradient(left,#ff6255,#ec0823);
		color: #fff;
		border-radius: 2rem 0 0 2rem;
	}
	.mob-foot a:nth-child(3) {
		background: -webkit-linear-gradient(left,#ffcb01,#ff9502 30%,#ff9502);
		background: -o-linear-gradient(right,#ffcb01,#ff9502 30%,#ff9502);
		background: -moz-linear-gradient(right,#ffcb01,#ff9502 30%,#ff9502);
		background: linear-gradient(to right,#ffcb01,#ff9502 30%,#ff9502);
		color: #fff;
		border-radius: 0 2rem 2rem 0;
	}
	</style>
<!--添加微笑信!-->
<script src="https://cdn.bootcss.com/clipboard.js/2.0.4/clipboard.js"></script>
    <script>
        var clipboard = new ClipboardJS('#copyBtn');
        clipboard.on('success', function (e) {
            alert('微信号已复制成功。去微信直接添加即可');
            var locatUrl = "weixin://";       
            window.location.href = locatUrl;
            e.clearSelection(); 
        });
        clipboard.on('error', function (e) {
            console.error('复制失败', e.action,e.trigger);
        });
    </script>
<span id="copyContent">176-6292-8920</span>
<div class="mob-foot visible-xs">
		<a ><svg t="1637039703707" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4947" width="16" height="16"><path d="M532.48 0C238.592 0 0 204.8 0 457.216c0 150.016 54.784 272.896 163.84 361.984v150.016c0 40.96 13.824 54.784 34.304 54.784 12.8-0.512 24.576-5.12 34.304-13.824l163.84-95.744c45.056 8.192 90.624 12.288 136.704 13.824 293.376 0 491.52-218.624 491.52-471.04S778.752 0 532.48 0z m0 849.92c-27.136 0-95.744-6.656-122.88-6.656l-27.136-6.656-20.48 13.824-122.88 78.336v-148.48l-27.136-20.48c-88.576-75.264-126.464-179.2-126.464-302.08 0-218.624 194.56-378.88 454.144-378.88 175.104-3.584 395.776 153.6 413.184 378.88-7.168 231.936-181.248 392.192-420.352 392.192zM272.896 402.944c-33.792 0-61.44 27.648-61.44 61.44s27.648 61.44 61.44 61.44 61.44-27.648 61.44-61.44c0-16.384-6.656-31.744-17.92-43.52s-27.136-17.92-43.52-17.92z m239.104 0c-33.792 0-61.44 27.648-61.44 61.44s27.648 61.44 61.44 61.44 61.44-27.648 61.44-61.44c0-16.384-6.656-31.744-17.92-43.52s-27.136-17.92-43.52-17.92z m239.104 0c-33.792 0-61.44 27.648-61.44 61.44s27.648 61.44 61.44 61.44 61.44-27.648 61.44-61.44c0-16.384-6.656-31.744-17.92-43.52-11.776-11.776-27.136-17.92-43.52-17.92z" p-id="4948" fill="#ffffff"></path></svg><span id="copyBtn" data-clipboard-action="copy" data-clipboard-target="#copyContent">复制微信号</span></a>
		<a href="tel:176-6292-8920" rel="nofollow"><svg t="1637039661505" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3967" width="16" height="16"><path d="M705.74 604.873333a53.4 53.4 0 0 0-75.426667 0l-37.713333 37.713334c-21.333333 21.333333-90.413333 0.1-150.846667-60.34S360.046667 452.76 381.413333 431.4l0.046667-0.046667 37.666667-37.666666a53.4 53.4 0 0 0 0-75.426667l-165.94-165.933333a53.393333 53.393333 0 0 0-75.42 0l-37.713334 37.713333c-27.866667 27.866667-44.84 64.52-50.46 108.946667-5.213333 41.206667-0.406667 87.42 14.28 137.333333C133.333333 536.586667 199.773333 642 290.9 733.1S487.42 890.666667 587.653333 920.126667c36.926667 10.86 71.813333 16.32 104.146667 16.32a264.333333 264.333333 0 0 0 33.213333-2.04c44.426667-5.62 81.08-22.593333 108.946667-50.46l37.713333-37.713334a53.393333 53.393333 0 0 0 0-75.42z m135.76 211.193334l-37.706667 37.713333c-42.58 42.573333-115.06 51.6-204.1 25.413333-93.506667-27.5-192.453333-90.1-278.62-176.266666s-148.766667-185.113333-176.266666-278.62c-26.186667-89.033333-17.16-161.52 25.413333-204.1l37.713333-37.706667a10.666667 10.666667 0 0 1 15.086667 0l165.933333 165.933333a10.666667 10.666667 0 0 1 0 15.086667l-37.713333 37.706667C329.113333 423.333333 324.666667 458.82 338.766667 501.073333c12.426667 37.273333 38.286667 76.813333 72.813333 111.333334s74.073333 60.386667 111.333333 72.813333c16.213333 5.406667 31.42 8.08 45.26 8.08 22.233333 0 40.946667-6.913333 54.586667-20.553333l37.706667-37.713334a10.666667 10.666667 0 0 1 15.086666 0l165.933334 165.933334a10.666667 10.666667 0 0 1 0.013333 15.1zM576 234.666667a21.333333 21.333333 0 0 1 21.333333-21.333334 213.333333 213.333333 0 0 1 213.333334 213.333334 21.333333 21.333333 0 0 1-42.666667 0c0-94.106667-76.56-170.666667-170.666667-170.666667a21.333333 21.333333 0 0 1-21.333333-21.333333z m0 128a21.333333 21.333333 0 0 1 21.333333-21.333334 85.426667 85.426667 0 0 1 85.333334 85.333334 21.333333 21.333333 0 0 1-42.666667 0 42.713333 42.713333 0 0 0-42.666667-42.666667 21.333333 21.333333 0 0 1-21.333333-21.333333z m362.666667 64a21.333333 21.333333 0 0 1-42.666667 0c0-164.666667-134-298.666667-298.666667-298.666667a21.333333 21.333333 0 0 1 0-42.666667 341.073333 341.073333 0 0 1 341.333334 341.333334z" fill="#ffffff" p-id="3968"></path></svg>一键拨打</a>
		<a href="tel:176-6292-8920" rel="nofollow"><svg t="1637039748245" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5994" width="16" height="16"><path d="M927.616 465.6C923.328 236.704 745.888 51.808 528 51.808h-32c-217.888 0-395.328 184.896-399.616 413.76C58.112 487.744 32 528.672 32 576v64c0 70.592 57.408 128 128 128s128-57.408 128-128v-64a128.064 128.064 0 0 0-126.784-127.872C173.728 262.688 318.912 115.808 496 115.808h32c177.12 0 322.272 146.88 334.784 332.32A128.064 128.064 0 0 0 736 576v64c0 57.792 38.72 106.176 91.392 122.016a337.504 337.504 0 0 1-191.936 124.48A79.712 79.712 0 0 0 560 832a80 80 0 1 0 0 160 79.68 79.68 0 0 0 67.872-38.112 402.432 402.432 0 0 0 278.24-193.6C955.968 742.816 992 695.776 992 640v-64c0-47.328-26.112-88.256-64.384-110.4zM224 576v64c0 35.296-28.704 64-64 64s-64-28.704-64-64v-64c0-35.296 28.704-64 64-64s64 28.704 64 64z m704 64c0 34.304-27.2 62.176-61.12 63.712l-2.496-1.184c-0.224 0.512-0.576 0.928-0.8 1.408A64 64 0 0 1 800 640v-64c0-35.296 28.704-64 64-64s64 28.704 64 64v64z" p-id="5995" fill="#ffffff"></path></svg>联系客服</a>
</div>

 

演示地址：方正电梯井道_电梯井模板-山东方正建筑新型材料有限公司 (fzjingdao.com)http://www.fzjingdao.com/