DHTML CSS

DHTML � uma N�O l�ngua scripting como o Javascript, mas simplesmente uma caracter�stica do browser, ou o realce, que d� a seu browser a abilidade de ser din�mico. O que querem realmente aprender n�o s�o DHTML pr�prios mas rather, a sintaxe necessitada usar DHTML. � a abilidade do browser de alterar o estilo e o olhar de um Web page depois que a p�gina carregou.

Est� aqui uma demonstra��o simples. o texto abaixo da cor da mudan�a quando o rato se mover sobre ele:

Mover seu rato aqui

O c�digo olha o gosto:

id= Move seu rato here

A fim come�ar este efeito, eu acedi primeiramente do ID do elemento. Ent�o, atrav�s do objeto do estilo, e finalmente da propriedade de cor do estilo. Todas as propriedades do estilo s�o de leitura/grava��o, e s�o alcan�adas em uma maneira similar: nome do object->property do id->style do elemento.

DHTML inclui o CSS e o Javascript

Por meio do Javascript, DHTML � a mudan�a das declara��es do estilo de um elemento do HTML. Por exemplo, se voc� tivesse um par�grafo com algum texto, a cor definiu perto

p {color: #cc0000;}

voc� pode fazer algo como

element.style.color = '#00cc00';

assim que este bocado do certificado for executado a cor do texto muda de vermelho ao verde.

Este bocado simples de DHTML n�o � suportado infelizmente por Netscape 4. No fato, Netscape 4 suporta somente mover-se dos elementos atrav�s da p�gina e faz�-los coisas invis�veis (e algumas outras, mas estes s�o os mais importantes) e vis�veis. Assim n�s damos a um elemento uma posi��o na p�gina:

div {position: absolute;
top: 20px;
left: 0px;}

e mudar ent�o sua esquerda:

element.style.left = 200;

Agora o elemento move-se m�gica para 200 pixels da margem esquerda da p�gina.

A propriedade do estilo

Assim geralmente, voc� vai primeiramente ao elemento do HTML no Internet Explorer que voc� quer influenciar como:-

document.all['tobechanged'].style.left = 200;

mudar ent�o as declara��es do estilo:

element.style.styleDeclaration

Se voc� quiser mudar a cor, o styleDeclaration � cor, se voc� quiser mudar a esquerda, ele est� saido. Se voc� quiser mudar uma declara��o do estilo com um tra�o nele, por exemplo o z-�ndice, remove o tra�o e faz � primeira letra ap�s o tra�o um capital: zIndex. Mesmos para o marginLeft margem-esquerdo do =>.

Anotar que a propriedade do estilo reflete os estilos inline do elemento. Isto � importante se voc� quiser ler para fora os estilos do elemento. Se voc� tentar ler para fora a cor do par�grafo:

p#testP {color: #cc0000;}

This is the paragraph.

alert([testP].style.color);

voc� come�a um alerta vazio. Isto � porque o P n�o (ainda) tem um estilo inline da cor. O estilo definido pelo p#testP n�o � readable atrav�s da propriedade do estilo.
Voc� define seus estilos inline, ele trabalha muito bem

This is the paragraph.

alert([testP].style.color);

Netscape 4

A propriedade de .style � requerida em todos os browsers, � exce��o de Netscape 4

O elemento correto

Assim mudar o estilo de um determinado elemento do HTML n�o � dif�cil, a n�o ser que esse muitas coisas n�o trabalhem em Netscape 4. Entretanto, voc� tamb�m tem que dizer ao browser que elemento do HTML voc� quer influenciar. Para fazer este, voc� deve invoc�-lo por seu elemento correto ID

[content of div]

e escrever o certificado de DHTML para convidar esse ID:

[element with ID=tobechanged].style.left = 200;

H� dois problemas aqui. � primeiramente a defini��o apropriada de uma camada em Netscape 4, e � em segundo as diferen�as em DOM (modelo do objeto do original) entre os v�rios browsers.

Camadas em Netscape 4

Se voc� quiser mudar o estilo de um elemento em Netscape 4, esse elemento deve ter uma declara��o da posi��o na folha do estilo. Se voc� n�o lhe der uma posi��o, Netscape 4 simplesmente n�o reconhece o elemento como uma camada e n�o o joga acima das mensagens de erro.

Por exemplo:

div#tobechanged {position: absolute;
top: 20px;
left: 0px;}

Agora o DIV com ID= " tobechanged " tem uma posi��o e Netscape 4 reconhece-a como uma camada. Voc� pode tamb�m usar a posi��o: relativo. Isto significa que o elemento est� posicionado pelo fluxo natural da p�gina, mas est� nonetheless aberto � influ�ncia de DHTML.

Ciao assim para dar a suas camadas uma posi��o.