jquery qart带图案二维码生成效果代码
代码语言:html
所属分类:其他
代码描述:jquery qart带图案二维码生成效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <style type="text/css"> body { width: 100%; padding: 0; background-color: #FFFFF6; } h1, h2 { text-align: center; } input[type=text] { display: block; width: 380px; height: 30px; margin: 0 auto; font-size: 14pt; } input[type=file] { display: block; width: 380px; height: 30px; margin: 0 auto; } label { display: block; width: 380px; height: 30px; margin: 0 auto; } .group { width: 400px; height: 195px; margin: 0 auto; } .clear { clear: both; } #qr { float: left; width: 195px; height: 195px; margin: 0 auto; margin-right: 10px; } #image { float: left; width: 195px; height: 195px; margin: 0 auto; margin-top: 12px; } #combine { width: 195px; height: 195px; margin: 0 auto; } </style> </head> <body> <div class="container"> <header class="header"> <h1>生成带指定图像效果js二维码 </h1> </header> <div class="content "> <h2>From</h2> <input id="value" type="text" value="http://www.bfw.wiki"> <input id="file" type="file"> <label> 黑白: <input type="radio" value="threshold" name="filter" checked> 彩色: <input type="radio" value="color" name="filter"> </label> <div class="group"> <div id="qr"></div> <div id="image"><img src="//repo.bfw.wiki/bfwrepo/image/6098ff67cddfe.png" width="171"></div> <div class="clear"></div> </div> <h2>To</h2> <div id="combine"></div> </div> </div> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery-3.2.1.min.js"></script> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/qrcode.1.0.js"></script> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/qart.min.js"></script&.........完整代码请登录后点击上方下载按钮下载查看
网友评论0