首页>>Jquery文字>>纯CSS网页右下角悬浮在线人工客服和二维码代码(2019-05-15)

纯CSS网页右下角悬浮在线人工客服和二维码代码

纯CSS网页右下角悬浮在线人工客服和二维码代码
演示
下载
赞赏支持
立刻微信赞赏支持 关闭

 

XML/HTML Code
  1. <div class="jdc-side" style="display: block;">  
  2.   <div class="mod_hang_qrcode jdc_feedback_qrcode">  
  3.     <div class="mod_hang_qrcode_btn"><i class="jdcfont"></i><span>扫码反馈</span></div>  
  4.     <div class="mod_hang_qrcode_show">  
  5.       <div class="mod-qr-tips"></div>  
  6.       <div class="mod_hang_qrcode_show_bg">  
  7.         <div id="canvas" style="height: 160px; width: 123px;"><img src="http://www.freejs.net/images/wx.png" width="130"></div>  
  8.       </div>  
  9.       <p>扫一扫，付款给我</p>  
  10.     </div>  
  11.   </div>  
  12.   <div class="mod_hang_appeal">  
  13.     <div class="mod_hang_appeal_btn"><i class="jdcfont"></i> <span>咨询反馈</span></div>  
  14.     <div class="mod_hang_appeal_show">  
  15.       <ul>  
  16.         <li><a href="#" target="_blank">  
  17.           <div class="icon_box"><i class="jdcfont"></i></div>  
  18.           <div class="text_box">  
  19.             <h5>人工客服</h5>  
  20.             <p>7*12 专业客服，服务咨询</p>  
  21.           </div>  
  22.           </a></li>  
  23.         <li id="entry"><a href="#" target="_blank" class="f-cb">  
  24.           <div class="icon_box"><i class="jdcfont"></i></div>  
  25.           <div class="text_box">  
  26.             <h5>工单服务</h5>  
  27.             <p>7*24全时处理，技术支持</p>  
  28.           </div>  
  29.           </a></li>  
  30.         <li><a href="#" target="_blank" class="f-cb">  
  31.           <div class="icon_box"><i class="jdcfont"></i></div>  
  32.           <div class="text_box">  
  33.             <h5>投诉建议</h5>  
  34.             <p>倾耳聆听，一个工作日内及时处理</p>  
  35.           </div>  
  36.           </a></li>  
  37.       </ul>  
  38.     </div>  
  39.     </div>  
  40.   <div class="mod_hang_qrcode jdc_hang_qrcode"><a class="mod_hang_qrcode_btn"><i class="jdcfont"></i><span>扫码关注</span></a>  
  41.     <div class="mod_hang_qrcode_show">  
  42.       <div class="mod_hang_qrcode_show_bg"></div>  
  43.       <p>付款给我</p>  
  44.     </div>  
  45.   </div>  
  46.   <div class="mod_hang_qrcode mod_hang_top"><a href="#" class="mod_hang_qrcode_btn"><i class="jdcfont"></i><span>返回顶部</span></a></div>  
  47.   <div class="el-dialog__wrapper" style="display: none;">  
  48.     <div class="el-dialog el-dialog--small" style="top: 15%;">  
  49.       <div class="el-dialog__header"><span class="el-dialog__title"></span>  
  50.         <div type="button" class="el-dialog__headerbtn"><i class="el-dialog__close el-icon el-icon-close"></i></div>  
  51.       </div>  
  52.       </div>  
  53.   </div>  
  54. </div>  

 


原文地址:http://www.freejs.net/article_jquerywenzi_771.html