You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
75 lines
1.6 KiB
75 lines
1.6 KiB
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
|
|
<title>Games</title>
|
|
<link rel="stylesheet" href="styles/base.css" />
|
|
<link rel="stylesheet" href="styles/tabela.css" />
|
|
</head>
|
|
|
|
<body>
|
|
<script>
|
|
document.addEventListener(
|
|
'scroll', (e) => {
|
|
const titulo = document.getElementById('titulo')
|
|
titulo.innerHTML = `
|
|
Posição Scroll:
|
|
${window.scrollX}, ${parseInt(window.scrollY)}
|
|
`
|
|
if (window.scrollY > 50) {
|
|
titulo.style.color = 'yellow'
|
|
} else {
|
|
titulo.style.color = 'white'
|
|
}
|
|
}
|
|
)
|
|
</script>
|
|
<header onmouseover="this.style.backgroundColor = 'black'" onmouseout="this.style.backgroundColor = 'grey'">
|
|
<h1 id="titulo" class="titulo-pagina">Games</h1>
|
|
<p>
|
|
<a href="index.html">Home</a>
|
|
·
|
|
<a href="tabela.html">Games</a>
|
|
·
|
|
<a href="formulario.html">Contact</a>
|
|
</p>
|
|
</header>
|
|
<main>
|
|
|
|
<div>
|
|
<p id="lista-marcas"></p>
|
|
</div>
|
|
<h1>Games</h1>
|
|
<table class="tabela tabela-espaco-interno" cellspacing="0" cellpadding="0" border="0">
|
|
<thead>
|
|
<tr>
|
|
<th>Nome</th>
|
|
<th>Jogos</th>
|
|
<th>Ano</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>Super Mario Bros</td>
|
|
<td>32 fases</td>
|
|
<td>1997</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Mario Kart</td>
|
|
<td>112fases</td>
|
|
<td>2002</td>
|
|
</tr>
|
|
<tr>
|
|
<!--td>Barco</td-->
|
|
<td>Mario Run</td>
|
|
<td>140 fases</td>
|
|
<td>2019</td>
|
|
</tr>
|
|
</tbody>
|
|
|
|
</table>
|
|
</main>
|
|
</body>
|
|
|
|
</html>
|