|
|
|
@@ -0,0 +1,43 @@ |
|
|
|
<!DOCTYPE html> |
|
|
|
<html> |
|
|
|
<head> |
|
|
|
<title>Память | Memory</title> |
|
|
|
</head> |
|
|
|
<body> |
|
|
|
</body> |
|
|
|
<script> |
|
|
|
/* |
|
|
|
document.onclick = function() { |
|
|
|
document.body.innerHTML += "!"; |
|
|
|
}; |
|
|
|
*/ |
|
|
|
|
|
|
|
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" |
|
|
|
} |
|
|
|
|
|
|
|
</script> |
|
|
|
</html> |
Михаил Капелько