Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

LEO8789

[Resolvido] tipo de documento afetando o javascript

Por , em Javascript

Recommended Posts

LEO8789    0

LEO8789
Postado

Pessoal peguei um código do livro use a cabeça: javascript

e percebi que uma função que faz com que

a rocha fique no mesmo tamanho em diversos navegadores só funciona

se não colocar o dtd no documento html.

se fizerem o teste em vários navegadores perceberão que só funciona se

tirarmos a primeira linha alguém sabe o porquê? qual a dtd mais apropriada?

e onde posso aprender mais sobre isso? Desde já obrigado...

Segue o código a imagem podem pegar aqui http://headfirstlabs.com/books/hfjs/ch01/irock/rock.png

e a outra aqui http://headfirstlabs.com/books/hfjs/ch01/irock/rock.png:

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="cookie.js"></script>
 <script type="text/javascript">
 var username;
 function resizeRock() {
        document.getElementById("pedra").style.height = (document.body.clientHeight - 100) * 0.9;
      }

function greetUser() {
	if(navigator.cookieEnabled)
	 username = readCookie("irock_username");
	if(username)
        alert('Prazer em conhecê-lo ' + username + '!!!');
		else
		alert('Olá, Eu sou sua rocha de estimação.');
      }


      function tocapedra() {
        if (username) {
          alert("Eu gosto de atenção, " + username + ". Obrigado.");
        }
        else {
          username = prompt("Qual é o seu nome?", "Entre aqui com o nome.");
          if (username) {
            alert("É bom conhecer você, " + username + ".");
            if (navigator.cookieEnabled)
              writeCookie("irock_username", username, 5 * 365);
            else
              alert("Cookies aren't supported/enabled in your browser, which means I won't remember you later. I'm sorry.");
          }
        }
   document.getElementById("pedra").src = "rock_happy.png";
   setTimeout("document.getElementById('rockImg').src = 'rock.png';", 5 * 60 * 1000);
      }

</script>
</head>

<body onload="resizeRock(); greetUser();">
<div style="margin-top:100px; text-align:center">
<img src="rock.png" alt="pedra" id="pedra" onclick="tocapedra()"  />
</div>
</body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Otata    4

Otata
Postado

cada doctype é um nivel.

 

são 3:

 

STRICT - É a que segue mais rigida nos padrões, ou seja tem que estar "perfeito" o html e css

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML; 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

 

TRANSITIONAL - Tem maior flexibilidade e é indicada para documentos que ainda utilizem elementos em desuso e tal.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML; 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

FRAMESET - é tipo transational para usar com frames

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML; 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

 

e nesse script por exemplo uma coisa que vi que influência

 

document.getElementById("pedra").style.height = (document.body.clientHeight - 100) * 0.9;

falta o "px" o certo seria

 

 document.getElementById("pedra").style.height = (document.body.clientHeight - 100) * 0.9 + 'px';

 

isso é uma coisa que afeta por causa do doctype..pq ele nao vai saber se 'px', 'cm' enfim

 

t+

Compartilhar este post

Link para o post
Compartilhar em outros sites

LEO8789    0

LEO8789
Postado

cada doctype é um nivel.

 

são 3:

 

STRICT - É a que segue mais rigida nos padrões, ou seja tem que estar "perfeito" o html e css

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML; 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

 

TRANSITIONAL - Tem maior flexibilidade e é indicada para documentos que ainda utilizem elementos em desuso e tal.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML; 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

FRAMESET - é tipo transational para usar com frames

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML; 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

 

e nesse script por exemplo uma coisa que vi que influência

 

document.getElementById("pedra").style.height = (document.body.clientHeight - 100) * 0.9;

falta o "px" o certo seria

 

 document.getElementById("pedra").style.height = (document.body.clientHeight - 100) * 0.9 + 'px';

 

isso é uma coisa que afeta por causa do doctype..pq ele nao vai saber se 'px', 'cm' enfim

 

t+

 

puxa muito obrigado era exatamente isso que tava faltando

obrigado também pelas explicações

resolvido.

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito