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.