Menu Dinâmico

Março 21, 2005

Boa Tarde!

Estou trabalhando num site:

http://www.decasamoveis.com.br e na parte de Catálogo (é presiso registrar no site p/ obter login) em que estou tentando fazer men dinâmico.

Para quem não sabe, menu dinâmico é quando eu tenho um linmk e, ao clicar nele aparecerá outros sublinks.

Lá no site, quando clica em cozinha, aparece, logo baixo, seus sub-links. Mas quando clico em jardim, não aparece logo abaixo de jardim os seus sublinks, mas sim abaixo de cozinha.

Gostaria, quem puder me ajudar, de como poderei corrigir esse erro.

Ficarei muito grato a essa pessoa bem como ela ajudará a salvar meu emprego!!!

Obrigado.

Antonio A L Pereira · Março 21, 2005

Segue um script com menus e sub menus

******************* inicio

<html>

<body>

<HEAD>

<!-- Begin

var isDOM = (document.getElementById ? true : false);

var isIE4 = ((document.all && !isDOM) ? true : false);

var isNS4 = (document.layers ? true : false);

function getRef(id) {

if (isDOM) return document.getElementById(id);

if (isIE4) return document.all[id];

if (isNS4) return document.layers[id];

}

function getSty(id) {

return (isNS4 ? getRef(id) : getRef(id).style);

}

var popTimer = 0;

var litNow = new Array();

function popOver(menuNum, itemNum) {

clearTimeout(popTimer);

hideAllBut(menuNum);

litNow = getTree(menuNum, itemNum);

changeCol(litNow, true);

targetNum = menu[menuNum][itemNum].target;

if (targetNum > 0) {

thisX = parseInt(menu[menuNum][0].ref.left) + parseInt(menu[menuNum][itemNum].ref.left);

thisY = parseInt(menu[menuNum][0].ref.top) + parseInt(menu[menuNum][itemNum].ref.top);

with (menu[targetNum][0].ref) {

left = parseInt(thisX + menu[targetNum][0].x);

top = parseInt(thisY + menu[targetNum][0].y);

visibility = 'visible';

}

function popOut(menuNum, itemNum) {

if ((menuNum == 0) && !menu[menuNum][itemNum].target)

hideAllBut(0)

else

popTimer = setTimeout('hideAllBut(0)', 500);

}

function getTree(menuNum, itemNum) {

itemArray = new Array(menu.length);

while(1) {

itemArray[menuNum] = itemNum;

if (menuNum == 0) return itemArray;

itemNum = menu[menuNum][0].parentItem;

menuNum = menu[menuNum][0].parentMenu;

}

function changeCol(changeArray, isOver) {

for (menuCount = 0; menuCount < changeArray.length; menuCount++) {

if (changeArray[menuCount]) {

newCol = isOver ? menu[menuCount][0].overCol : menu[menuCount][0].backCol;

with (menu[menuCount][changeArray[menuCount]].ref) {

if (isNS4) bgColor = newCol;

else backgroundColor = newCol;

}

function hideAllBut(menuNum) {

var keepMenus = getTree(menuNum, 1);

for (count = 0; count < menu.length; count++)

if (!keepMenus[count])

menu[count][0].ref.visibility = 'hidden';

changeCol(litNow, false);

}

function Menu(isVert, popInd, x, y, width, overCol, backCol, borderClass, textClass) {

this.isVert = isVert;

this.popInd = popInd

this.x = x;

this.y = y;

this.width = width;

this.overCol = overCol;

this.backCol = backCol;

this.borderClass = borderClass;

this.textClass = textClass;

this.parentMenu = null;

this.parentItem = null;

this.ref = null;

}

function Item(text, href, frame, length, spacing, target) {

this.text = text;

this.href = href;

this.frame = frame;

this.length = length;

this.spacing = spacing;

this.target = target;

this.ref = null;

}

function writeMenus() {

if (!isDOM && !isIE4 && !isNS4) return;

for (currMenu = 0; currMenu < menu.length; currMenu++) with (menu[currMenu][0]) {

var str = '', itemX = 0, itemY = 0;

for (currItem = 1; currItem < menu[currMenu].length; currItem++) with (menu[currMenu][currItem]) {

var itemID = 'menu' + currMenu + 'item' + currItem;

var w = (isVert ? width : length);

var h = (isVert ? length : width);

if (isDOM || isIE4) {

str += '<div id="' + itemID + '" style="position: absolute; left: ' + itemX + '; top: ' + itemY + '; width: ' + w + '; height: ' + h + '; visibility: inherit; ';

if (backCol) str += 'background: ' + backCol + '; ';

str += '" ';

}

if (isNS4) {

str += '<layer id="' + itemID + '" left="' + itemX + '" top="' + itemY + '" width="' + w + '" height="' + h + '" visibility="inherit" ';

if (backCol) str += 'bgcolor="' + backCol + '" ';

}

if (borderClass) str += 'class="' + borderClass + '" ';

str += 'onMouseOver="popOver(' + currMenu + ',' + currItem + ')" onMouseOut="popOut(' + currMenu + ',' + currItem + ')">';

str += '<table width="' + (w - 8) + '" border="0" cellspacing="0" cellpadding="' + (!isNS4 && borderClass ? 3 : 0) + '"><tr><td align="left" height="' + (h - 7) + '">' + '<a class="' + textClass + '" href="' + href + '"' + (frame ? ' target="' + frame + '">' : '>') + text + '</a></td>';

if (target > 0) {

menu[target][0].parentMenu = currMenu;

menu[target][0].parentItem = currItem;

if (popInd) str += '<td class="' + textClass + '" align="right">' + popInd + '</td>';

}

str += '</tr></table>' + (isNS4 ? '</layer>' : '</div>');

if (isVert) itemY += length + spacing;

else itemX += length + spacing;

}

if (isDOM) {

var newDiv = document.createElement('div');

document.getElementsByTagName('body').item(0).appendChild(newDiv);

newDiv.innerHTML = str;

ref = newDiv.style;

ref.position = 'absolute';

ref.visibility = 'hidden';

}

if (isIE4) {

document.body.insertAdjacentHTML('beforeEnd', '<div id="menu' + currMenu + 'div" ' + 'style="position: absolute; visibility: hidden">' + str + '</div>');

ref = getSty('menu' + currMenu + 'div');

}

if (isNS4) {

ref = new Layer(0);

ref.document.write(str);

ref.document.close();

}

for (currItem = 1; currItem < menu[currMenu].length; currItem++) {

itemName = 'menu' + currMenu + 'item' + currItem;

if (isDOM || isIE4) menu[currMenu][currItem].ref = getSty(itemName);

if (isNS4) menu[currMenu][currItem].ref = ref.document[itemName];

}

with(menu[0][0]) {

ref.left = x;

ref.top = y;

ref.visibility = 'visible';

}

var menu = new Array();

// Cor do link selecionado

var defOver = '#336699', defBack = '#003366';

// Tamanho da coluna

var defLength = 22;

menu[0] = new Array();

menu[0][0] = new Menu(false, '', 5, 0, 17, '#669999', '#006666', '', 'itemText');

// Mude aqui a relação de links.

menu[0][1] = new Item(' Pastas', '#', '', 40, 10, 1);

menu[0][2] = new Item(' Arquivos', '#', '', 40, 10, 2);

menu[0][3] = new Item('   Outros', '#', '', 40, 10, 3);

// // Relação dos links do Site1

menu[0][4] = new Item('   Site1', 'suapagina.html', '_new', 40, 10, 0);

// // Relação dos links do Site 2

menu[0][5] = new Item(' Site 2', 'suapagina.html', '_new', 40, 10, 0);

// File menu.

menu[1] = new Array();

// The File menu is positioned 0px across and 22 down from its trigger, and is 80 wide.

// All text in this menu has the stylesheet class 'item' -- see the <style> section above.

// Relação dos links de pastas

menu[1][0] = new Menu(true, '>', 0, 22, 80, defOver, defBack, 'itemBorder', 'itemText');

menu[1][1] = new Item('link1', 'suapagina.html', '', defLength, 0, 0);

menu[1][2] = new Item('link2', 'suapagina.html', '', defLength, 0, 0);

// // Relação dos links pastas - link 3

menu[1][3] = new Item('link3', '#', '', defLength, 0, 4);

menu[1][4] = new Item('link4', 'suapagina.html', '', defLength, 0, 0);

// Relação dos links de arquivos

menu[2] = new Array();

menu[2][0] = new Menu(true, '>', 0, 22, 80, defOver, defBack, 'itemBorder', 'itemText');

menu[2][1] = new Item('link1', 'suapagina.html', '', defLength, 0, 0);

menu[2][2] = new Item('link2', 'suapagina.html', '', defLength, 0, 0);

menu[2][3] = new Item('link3', 'suapagina.html', '', defLength, 0, 0);

// Relação dos links de outros

menu[3] = new Array();

menu[3][0] = new Menu(true, '<', 0, 22, 80, defOver, defBack, 'itemBorder', 'itemText');

menu[3][1] = new Item('link1', 'suapagina.html', '', defLength, 0, 0);

menu[3][2] = new Item('link2', 'suapagina.html', '', defLength, 0, 0);

menu[3][3] = new Item('link3', 'suapagina.html', '', defLength, 0, 5);

menu[4] = new Array();

menu[4][0] = new Menu(true, '>', 85, 0, 120, '#333366', '#666699', 'crazyBorder', 'crazyText');

menu[4][1] = new Item('link1', 'suapagina.html', '', 36, 4, 0);

menu[4][2] = new Item('link2', 'suapagina.html', '', 36, 7, 0);

menu[4][3] = new Item('link3', 'suapagina.html', '', defLength, 0, 0);

menu[5] = new Array();

menu[5][0] = new Menu(true, '>', -85, -17, 80, defOver, defBack, 'itemBorder', 'itemText');

menu[5][1] = new Item('uma mensagem', 'suapagina.html', '', 40, 0, 0);

var popOldWidth = window.innerWidth;

nsResizeHandler = new Function('if (popOldWidth != window.innerWidth) location.reload()');

if (isNS4) document.captureEvents(Event.CLICK);

document.onclick = clickHandle;

function clickHandle(evt)

{

if (isNS4) document.routeEvent(evt);

hideAllBut(0);

}

function moveRoot()

{

with(menu[0][0].ref) left = ((parseInt(left) < 100) ? 100 : 5);

}

// -->

</script>

<style>

<!--

.itemBorder { border: 1px solid black }

.itemText { text-decoration: none; color: #FFFFFF; font: 12px Arial, Helvetica }

.crazyBorder { border: 2px outset #663399 }

.crazyText { text-decoration: none; color: #FFCC99; font: Bold 12px Arial, Helvetica }

-->

</style>

</HEAD>

</body>

</html>

******************* fim

Salve todo o script como htm e execute no ie

cyberalexxx · Março 22, 2005

Vou mover para JS/CSS que a galera pode ajudar melhor.

[]'s

Entrar

Menu Dinâmico

Pergunta

Guest usuário - Bravosky

Link para o comentário

Compartilhar em outros sites

2 respostass a esta questão

Posts Recomendados

Antonio A L Pereira

Link para o comentário

Compartilhar em outros sites

cyberalexxx

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades