jquery.qrcode.jsを使ってQRコードを生成する方法をご紹介します。
Contents
ディスプレイ広告
jquery.qrcode.jsを使ってQRコードを生成するCSSの記述
※必要に応じて変更して下さい。
<style>
body {
font-size: 18px;
text-align: center;
}
h1{
text-align: center;
font-size: 22px;
line-height: 1.6em;
padding-top: 20px;
}
</style>
jquery.qrcode.jsを使ってQRコードを生成するHTMLの記述
※id=”output”に生成したQRコードを出力します。
<h1>jquery.qrcode.jsを使って以下にQRコードを生成表示してます。<br>URLが https://dad-union.com のQRコードを生成してます。</h1>
<div id="output"></div>
jquery.qrcode.jsを使ってQRコードを生成するJavaScriptの記述
※jquery-1.11.0.min.js、jquery.qrcode.min.jsファイルを読み込みます。jQuery(‘QRコード出力先タグ要素’).qrcode(“QRコード生成するURL”)
<script src="jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="jquery.qrcode.min.js"></script>
<script>
jQuery(function(){
jQuery('#output').qrcode("https://dad-union.com");
})
</script>
jquery.qrcode.jsを使ってQRコードを生成するデモページ
jquery.qrcode.jsを使ってQRコードを生成するデモページ
ソース元:jquery-qrcode
jquery-qrcode
※流用される場合は自己責任でお願いします。
デモページheadタグ内のGoogleアナリティクスタグは流用しないで下さい。