javascript api
Using the javascript api
Initialize the QRtag api
To initialize the QRtag api use the followin code :
<script type="text/javascript" src="http://api.qrtag.net/js"></script>
You can place this peace of code in your body or just above the main function.
Declare an QRtag object
First of all we need to declare an QRtag object :
var qrtag = new QRtag();
In this case the name of the object is qrtag.
Do some settings
You can setup your QR code to your personal taste by using the following functions :
qrtag.target();
The target id of the HTML object.
qrtag.data();
The data that the QRtag contains.
qrtag.size();
The size in pixels.
qrtag.border();
The border size in pixels.
qrtag.color();
Sets the code color. Must be a hex color code (default = #000000, black).
qrtag.bgcolor();
Sets the background color. Must be a hex color code (default = #FFFFFF, white).
qrtag.link();
Creates a clickable QR code. If in use must contain a valid URL.
qrtag.id();
The id of the QRtag.
qrtag.class_name();
The class nam of the QRtag (handy when using CSS styles)
qrtag.place();
Where to float!
Viewing the QRtag
Finished the setup? Show it!
qrtag.image();
Alternatively you can use the function to set parameters as well.
qrtag.image("qrtag_div","An other test",400,20,"http://www.atecmedia.com");
Standard javascript api
Discription :
This example shows you an QR code containing "Hello World!". When you click on it you will be redirected to http://www.atecmedia.com.
Source :
<script type="text/javascript" src="http://api.qrtag.net/js"></script>
<script type="text/javascript">
var qrtag = new QRtag();
qrtag.data("Hello World!");
qrtag.link("http://www.atecmedia.com");
qrtag.id("QRcode");
qrtag.class_name("QRcode");
qrtag.size(400);
qrtag.border(10);
qrtag.color("#660000");
qrtag.bgcolor("#ffff00");
qrtag.target();
qrtag.print_image();
</script>
Result :
Note :
The actual size of this QR code is 400px + 20px (2 x border 10px).
You can adjust some CSS style by giving the QR code a class name.
If your QR code is in a layer use the function qrtag.target("target_div").
QRtag short version
Discription :
This example creates QR code in a div with the short version scripting style.
Source :
<div id="qrtag_div" style="width : 600px; height : 420px; background : #00f; text-align : center;"></div>
<script type="text/javascript" src="http://api.qrtag.net/js"></script>
<script type="text/javascript">
var qrtag = new QRtag();
qrtag.image("qrtag_div","An other test",400,20,"http://www.atecmedia.com");
</script>
Result :
Note :
The order of variables that you can use in the qrtag.image() function are :
- target : the target id of the HTML object.
- data : The data that the QRtag contains.
- size : The size in pixels.
- border : The border size in pixels.
- link : Creates a clickable QR code. If in use must contain a valid URL
- id : The id of the QRtag.
- class_name : The class nam of the QRtag (handy when using CSS styles)
- place : Where to float!
If you don't want to use a variable the leave empty bij entering "". So for example if you want an QRcode of the current page with a size of 200px enter :
qrtag.image("","",400");
As you can see place 3 (size) is only entered.
Create a simple QRcode with the QRtag api
Discription :
This example shows you an QR code containing the url of the page that it is displayed on.
Source :
<script type="text/javascript" src="http://api.qrtag.net/js"></script>
<script type="text/javascript">var qrtag = new QRtag(); qrtag.image();</script>
Result :
Note :
This is the shortest way to produce an QR code with the javascript based class.