-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
82 lines (67 loc) · 2.32 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>QR Code Generator</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<script type="text/javascript">
function genQR()
{
var gapi="https://api.qrserver.com/v1/create-qr-code/?size=";
// https://api.qrserver.com/v1/create-qr-code/?size=150x150&data=Example;
var myimg=document.getElementById("img");
var mytext=document.getElementById("qrtext").value;
var mysize=document.getElementById("size").value;
if (mytext!=="" && mysize=="100")
{
myimg.src=gapi+"100x100"+"&data="+mytext;
}
else if(mytext!=="" && mysize=="150")
{
myimg.src=gapi+"150x150"+"&data="+mytext;
}
else if(mytext!=="" && mysize=="200")
{
myimg.src=gapi+"200x200"+"&data="+mytext;
}
else if (mytext!=="" && mysize=="300")
{
myimg.src=gapi+"300x300"+"&data="+mytext;
}
else if (mytext!=="" && mysize=="400")
{
myimg.src=gapi+"400x400"+"&data="+mytext;
}
else
{
alert("Please Enter Text");
}
}
</script>
<div class="grid">
<h2>Generate your own QR Code</h2>
<center>
<img src="" id="img"></center>
<select id="size" class="select" title="Please Select the size">
<option value="100">100x100</option>
<option value="150">150x150</option>
<option value="200">200x200</option>
<option value="300">300x300</option>
<option value="400">400x400</option>
</select>
<br><br>
<input id="qrtext" type="text" name="text" class="input" placeholder="Type something here....">
<br><br>
<button type="submit" value="Generate" onclick="genQR()"> Generate
</button>
</div>
<footer>
<p>Developed By Mohit Maurya ❤️</p>
<!--Created By Mohit Maurya ❤️-->
</footer>
</body>
</html>