45 lines
1016 B
HTML
45 lines
1016 B
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Память | Memory</title>
|
|
</head>
|
|
<body>
|
|
</body>
|
|
<script>
|
|
var items = []
|
|
|
|
// Section16Buttons.
|
|
for (var i = 0; i < 16; i++) {
|
|
let item = document.createElement("div")
|
|
document.body.appendChild(item)
|
|
items.push(item)
|
|
item.id = `${i}`
|
|
}
|
|
|
|
// SectionGrid.
|
|
let side = Number(50)
|
|
let space = Number(20)
|
|
let gap = Number(side + space)
|
|
for (var id in items) {
|
|
var item = items[id]
|
|
let row = Math.floor(id / 4)
|
|
let x = gap + (id - row * 4) * gap
|
|
let y = gap + row * gap
|
|
item.style.left = `${x}px`
|
|
item.style.top = `${y}px`
|
|
item.style.width = `${side}px`
|
|
item.style.height = `${side}px`
|
|
item.style.position = "absolute"
|
|
item.style.background = "blue"
|
|
}
|
|
|
|
// SectionSelection.
|
|
for (let id in items) {
|
|
var item = items[id]
|
|
item.onclick = function() {
|
|
console.log("ИГР select id:", id)
|
|
}
|
|
}
|
|
</script>
|
|
</html>
|