Skip to content


Subversion checkout URL

You can clone with
Download ZIP
branch: master
Fetching contributors…

Cannot retrieve contributors at this time

159 lines (149 sloc) 4.796 kb
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
<html xmlns="">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="generator" content="pandoc" />
<meta name="date" content="" />
<div id="jquery.qrcode.js"
><a href=''>jquery.qrcode.js</a> is <em
>jquery plugin for a pure browser qrcode generation</em
>. It allow you to easily add qrcode to your webpages. It is standalone, less than 4k after minify+gzip, no image download. It doesnt rely on external services which go on and off, or add latency while loading. It is based on a <a href=''>library</a> which build qrcode in various language. <a href=''>jquery.qrcode.js</a> wraps it to make it easy to include in your own code.</p
>Show, dont tell, here is a <a href='examples/basic.html'>example</a></p
><div id="how-to-use-it"
>How to Use It</h2
>Let me walk you thru it. First include it in your webpage with the usual script tag</p
>&lt;script type=&quot;text/javascript&quot; src=&quot;jquery.qrcode.min.js&quot;&gt;&lt;/script&gt;
>Then create a DOM element which gonna contains the generated qrcode image. Lets say a div</p
>&lt;div id=&quot;qrcode&quot;&gt;&lt;/div&gt;
>Then you add the <em
> in this container by</p
>jquery('#qrcode').qrcode(&quot;this plugin is great&quot;);
>This is it. see it <a href='examples/basic.html'>live</a>.</p
><div id="conclusion"
><a href=''>jquery.qrcode.js</a> is available on github <a href=''>here</a> under <a href=''>MIT license</a>. If you hit bugs, fill issues on github. Feel free to fork, modify and have fun with it :)</p
body {
margin: auto;
padding-right: 1em;
padding-left: 1em;
max-width: 44em;
border-left: 1px solid #eee;
border-right: 1px solid #eee;
font-family : Verdana, sans-serif;
font-size : 100%;
line-height : 140%;
color : #eee;
background-color : #22252a;
pre {
border : 1px dotted gray;
background-color : #444a50;
color : #1111111;
padding : 0.5em;
code {
font-family : monospace;
a {
text-decoration : none;
color : lightSteelBlue;
a:hover {
text-decoration : underline;
h1, h2, h3, h4, h5 { font-family: verdana;
font-weight: bold;
border-bottom: 1px dotted #eee;
color: lightSteelBlue; }
h1 {
color : #cd5;
font-size : 130%;
h1:nth-child(1) {
font-size : 300%;
text-align : center;
height : 1em;
h2 {
font-size : 110%;
h3 {
font-size : 95%;
h4 {
font-size : 90%;
font-style : italic;
h5 {
font-size : 90%;
font-style : italic;
h1.title {
font-size : 200%;
font-weight : bold;
padding-top : 0.2em;
padding-bottom : 0.2em;
text-align : left;
border : none;
dt code {
font-weight : bold;
dd p {
margin-top : 0;
img {
/* border-color : white;
border-style : solid;
#footer {
padding-top : 1em;
font-size : 70%;
color : gray;
text-align : center;
<!-- follow me on twitter -->
<a href="">
<img style="position: absolute; bottom: 10px; right: 10px; border: 0;" src="" alt="Follow jerome_etienne on Twitter"/>
<!-- github ribbon -->
<a href=""><img style="position: absolute; top: 0; left: 0; border: 0;" src="" alt="Fork me on GitHub"></a>
<!-- twitter share + facebook like -->
<div style="position: absolute; top: 10px; right: 10px; border: 0;">
<a href="" class="twitter-share-button" data-count="none" data-via="jerome_etienne">Tweet</a><script type="text/javascript" src=""></script>
Jump to Line
Something went wrong with that request. Please try again.