-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
78 lines (68 loc) · 2.7 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
<!DOCTYPE html5>
<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>Card Image</title>
<link rel="icon" href="cards.png" type="image/png" sizes="16x16">
</head>
<body>
<img id="img" src="img/back.png" >
<label for="N" id="NumC"></label><br>
<div id="detail">
<b id="cn"></b>
<p id="cs"></p>
</div>
<label for="S" id="SybN">Choose Cards :</label>
<select name="Symbol" onchange="getimg()" id="S">
<option value="H">Heart</option>
<option value="S">Spear</option>
<option value="D">Diamond</option>
<option value="C">Club</option>
</select>
<select name="Num" onchange="getimg()" id="N">
<option value="A">Ace</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="0">10</option>
<option value="K">King</option>
<option value="Q">Queen</option>
<option accesskey="4" q="1" value="J">Jack</option>
<!-- <option value="X">Joker</option> -->
</select>
<button id="btn" onclick="Det()">Show Details</button>
</body>
<script>
n = document.getElementById("N"); //Numeric Card
s = document.getElementById("S"); //Symbolic of Card
cn =document.getElementById("cn"); //Card Name Fetch From multiple dimensional array(var CardName) (source.js)
cs =document.getElementById("cs"); //Symbol with unicode Name Fetch From multiple dimensional array(var uni_s/_n) (source.js)
btn =document.getElementById("btn"); //Btn of show details
img = document.getElementById("img"); //For Img Src
function getimg() { //call when onchange => N ,S
img.src ="img/"+n.value+s.value+".png"; //New Image apply
cn.innerText =CardName[sim[n.value]][sim[s.value]]; //Card Name
cs.innerText = uni_n[sim[n.value]][sim[s.value]] + " => " + uni_s[sim[n.value]][sim[s.value]]; //Card symbol & unicode
}
function getname(){
}
function Det() { // call when onclick btn (work => show/hide Div#detail)
var x = document.getElementById("detail");
if (x.style.display === "none") {
x.style.display = "block";
btn.innerText = "Hide Detail"
}else {
x.style.display = "none";
btn.innerText = "Show Detail";
}
}
</script>
<script src="source.js"></script>
</html>