tutoriais

Flash

FrontPage

Dreamweaver

Dhtml

Html

ASP

PHP

jogos

Galerias

fóruns

Flash

TUTORIAIS DE DHTML

Um menu de navegação bem simpático.

Um menu de navegação sempre presente na página, e simples de configurar.

Demo : A decorer

1. Inserir entre os tags <HEAD>...</HEAD>:

function makeStatic() {
if (document.all) {object1.style.pixelTop=document.body.scrollTop+offsettop}
else{eval(document.object1.top=eval(window.pageYOffset+offsettop));}
setTimeout("makeStatic()",0);
}

if (document.all) {document.write('<DIV ALIGN="CENTER" ID="object1" STYLE="Position:absolute; top:20; width:'+menuwidth+'; left:'+offsetleft+'; z-Index:5;cursor:hand;background-color:white"><TABLE BORDER="1" width="'+menuwidth+'" CELLPADDING="0" CELLSPACING="0" BORDERCOLOR="black" bgcolor="white">')}
else if (document.layers){ document.write('<LAYER top="20" name="object1" left="'+offsetleft+'" BGCOLOR=black><TABLE BORDER="0" CELLPADDING="0" CELLSPACING="1"><TR><TD><TABLE BORDER="0" CELLPADDING="0" CELLSPACING="0" width="'+menuwidth+'">')}

if (document.all||document.layers)
document.write('<TR><TD BGCOLOR="#3399FF" BORDERCOLORDARK="#99CCFF" BORDERCOLORLIGHT="#003399"><P ALIGN=CENTER><FONT SIZE="4" FACE=ARIAL>Menu</FONT></TD></TR>')

var menui = new Array();
var menul = new Array();

// Os textos do menu
menui[0]="Página inicial";
menui[1]="Scripts DHTML";
menui[2]="O que é DHTML";
menui[3]="Efeitos com textos";
menui[4]="Efeitos com imagens ";
menui[5]="Transições de páginas";
menui[6]="Links e botões";
menui[7]="Browser e resoluções";

// Os URL dos links associados aos textos
menul[0]="../../../index.htm";
menul[1]="../index.htm";
menul[2]="../aa/00001a.php";
menul[3]="../ac/index.htm";
menul[4]="../ad/index.htm";
menul[5]="../ae/index.htm";
menul[6]="../af/index.htm";
menul[7]="../ag/index.htm";

for (i=0;i<=menui.length-1;i++)
if (document.all) {document.write('<TR><TD BORDERCOLOR="white" ONCLICK="location=\''+menul[i]+'\'" onmouseover="className=\'menuh\'" onMouseout="className=\'menu\'"><CENTER><FONT size=-1 color=navy>'+menui[i]+'</FONT></TD></TR>')}
else if (document.layers){document.write('<TR><TD BGCOLOR="white"><ILAYER><LAYER width="'+menuwidth+'" onmouseover="bgColor=\'yellow\'" onmouseout="bgColor=\'white\'"><CENTER><A HREF="'+menul[i]+'" class=menulinks>'+menui[i]+'</A></CENTER></LAYER></ILAYER></TD></TR>')}

if (document.all) {document.write('</TABLE></DIV>')}
else if (document.layers){document.write('</TABLE></TD></TR></TABLE></LAYER>')}

function menu3(){
if (document.all||document.layers)
makeStatic()
}
window.onload=menu3
//-->
</script>

Na parte <STYLE> configura-se as cores do menu.

Na patre do <script> configura-se:

a largura do menu
var menuwidth=110
a posição em relação a borda esquerda
var offsetleft=10
a posição em relação a borda supérieur
var offsettop=90
os textos do menu
menui[0]="Página inicial";
menui[1]="Scripts DHTML";
menui[...]="..................";
Os URL dos links associados ao textos
menul[0]="../index.htm";
menul[1]="../dhtml/index.htm";
menul[2]="../Htmlplus/index.htm";

ANÚNCIOS