Pessoal, ajuda por favor, estou lendo o livro Use a Cabeça JavaScript que baixei aqui nesse grupo. Chegou num determinado exemplo que devo redimensionar o tamanho da imagem proporcional ao tamanho da janela. Estou deixando em 20% do tamanho da janela. Já coloquei um console.log antes e depois do redimensionamento e eles executaram com sucesso. Coloquei o cálculo em uma variável e esta variável no console.log e me devolveu o valor correto. Só a danada da imagem que não muda de tamanho de jeito nenhum. Não consigo achar o erro, a danada da imagem fica do mesmo tamanho. Vejam o código e me ajudem por favor. Tenho certeza que é uma coisa simples, mas, estou deixando passar. Obrigado.
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="utf-8">
<title>iRock - A rocha virtual de estimação</title>
<script type="text/javascript">
var userName;
function greetUser() {
alert("Olá, eu sou sua pedra de estimação!");
};
function touchRock() {
if (userName) {
alert("Eu gosto de atenção " + userName + ". Obrigado!!!");
}
else {
userName = prompt("Qual o seu nome?", "Digite seu nome")
if (userName) {
alert("Bom conhecer você " + userName + ".");
}
}
document.getElementById("rockImg").src = "rock_happy.jpg"
setTimeout("document.getElementById('rockImg').src='RochaSolitaria.png';", 3000);
};
function resizeRock() {
var altura = (document.body.clientHeight - 100) * 0.2;
document.getElementById("rockImg").style.height = altura;
}
</script>
</head>
<body onload="resizeRock(); greetUser();">
<div style="margin-top:100px; text-align:center">
<img id="rockImg" src="Rock.png" alt="iRock" style="cursor:pointer"
onclick="touchRock()"/>
</div>
</body>
</html>
