HTML实现二维码弹框

前言

在之前写网站的时候，需要在用户点击时弹出二维码图片。网上有很多这样的代码，但发现好多是只能够用于PC端，在移动端网页的效果不理想，后来找到一个在PC端和移动端都适配的比较好的代码，这里记录一下。

注：代码来自网络上的博客，非原创，原文请点击HTML5 微信二维码提示框。本例中对弹出窗体的外观做了点小小的改动，基本框架不变。

前端代码

供点击的标签：

触发事件：

          

              ![](./img/QQ_QR.jpg)
          
          

              加QQ好友
          
          

              ×
      

弹出效果

本例：

image.png

原博客上的弹出效果：

image.png

差别就是去掉了黑色边框，关闭按钮的大小和颜色不同，其余的一样。

后记

后来又发现一个弹窗，这里也mark一下：DIV+JS+CSS实现点击弹出图片效果
效果如下：

image.png

上图来源于原博客。

在更新一个资源站：站长素材

image.png