Ir para conteúdo
Fórum Script Brasil
  • 0

Menus Drop-down Vs. Combobox (select)


Guest Maxsuel Seibert

Pergunta

Guest Maxsuel Seibert

Ola pessoal biggrin.gif

Eu tenho um menu drop down. Quando ele é aberto sobre

um select, esse fica por cima do menu, e não por baixo

como os outros elementos. Antes eu utilizava a tecnica

de esconder esses select (os comboBox) qd o menu

estava aberto. Mas eu tinha visto / lido em algum

lugar uma forma de resolver isto sem precisar esconder

os combo, utilizando CSS ou coisa assim. Ficaria uma

solucao muito mais interessante.

No firefox, os combo ficam atraz mesmo.. mas no IE

não.

Outro problema q eu tive, desta vz apenas no firefox,

é qd o menu esta sobre um iframe, qd posiciono o

mouse sobre uma parte do menu q esta sobre o iframe, o

menu fecha. Ou seja, perde o foco do menu.

alguém já teve problemas com isso? alguma ideia?

solucao? sad.gif

Link para o comentário
Compartilhar em outros sites

2 respostass a esta questão

Posts Recomendados

  • 0

eis a solução, que todo mundo fala que não existe, mas EXISTE!

copia e cola este codigo em uma pagina e salva como htm, depois voce teste e ve como funciona!

<%@LANGUAGE="JAVASCRIPT" CODEPAGE="1252"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
	<HEAD>
  <title>SYS - Sistema Corporativo J&W </title>
  <meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
  <meta content="Visual Basic .NET 7.1" name="CODE_LANGUAGE">
  <meta content="JavaScript" name="vs_defaultClientScript">
  <meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  <LINK href="estilos.css" type="text/css" rel="stylesheet">
  <script language="JavaScript" type="text/JavaScript">
<!--
function MM_reloadPage(init) {  //reloads the window if Nav4 resized
  if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
  else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_showHideLayers() { //v6.0
  var i,p,v,obj,args=MM_showHideLayers.arguments;
  for (i=0; i<(args.length-2); i+=3) 
  if ((obj=MM_findObj(args[i]))!=null) { 
	v=args[i+2];
    if (obj.style) { 
  obj=obj.style; 
  v=(v=='show')?'visible':(v=='hide')?'hidden':v; 

    }
    
    obj.visibility=v;
    if (v=='visible')
  {
  MostraDiv(true,args[i]);	
  return;
  }
	else
  {
  MostraDiv(false,args[i]);
  }
    }
}

function MostraDiv(state,valor)
{
	var DivRef = document.getElementById(valor);
	var IfrRef = document.getElementById('DivMestra');

	if(state)
	{
  DivRef.style.display = "block";
  IfrRef.style.width = DivRef.offsetWidth;
  IfrRef.style.height = DivRef.offsetHeight;
  IfrRef.style.top = DivRef.style.top;
  IfrRef.style.left = DivRef.style.left;
  IfrRef.style.zIndex = DivRef.style.zIndex - 1;
  IfrRef.style.display = "block";
	}
	else
	{
  DivRef.style.display = "none";
  IfrRef.style.display = "none";
	}
}
//-->
  </script>
  <style type="text/css">
BODY { MARGIN: 0px }
  </style>
	</HEAD>
	<body>
  <div id="sistema" style="Z-INDEX: 100; LEFT: 616px; VISIBILITY: hidden; OVERFLOW: visible; WIDTH: 135px; POSITION: absolute; TOP: 80px; HEIGHT: 17px">
  	<table onmouseover="MM_showHideLayers('sistema','','show','produtos','','hide','clientes','','hide','cobranca','','hide','cobranca-sub1','','hide','usuario','','hide','empresa','','hide')"
    onmouseout="MM_showHideLayers('sistema','','hide')" cellSpacing="0" cellPadding="0"
    width="135" border="0" runat="server">
    <tr>
    	<td><IMG height="2" src="image/space.gif" width="1"></td>
    </tr>
    <tr>
    	<td bgColor="#74b84b"><IMG height="1" src="image/space.gif" width="1"></td>
    </tr>
    <tr>
    	<td bgColor="#ffffff"><IMG height="1" src="image/space.gif" width="1"></td>
    </tr>
    <tr>
    	<td>
      <table class="box2" cellSpacing="0" cellPadding="0" width="135" bgColor="#ffffff" border="0">
      	<tr>
        <td bgColor="#74b84b"><IMG height="5" src="image/space.gif" width="1"></td>
      	</tr>
      	<tr>
        <td><a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a>
         </td></tr>
      </table>
    	</td>
    </tr>
  	</table>
  </div>
  <div id="produtos" style="Z-INDEX: 100; LEFT: 516px; VISIBILITY: hidden; OVERFLOW: visible; WIDTH: 135px; POSITION: absolute; TOP: 80px; HEIGHT: 17px">
  	<table onmouseover="MM_showHideLayers('sistema','','hide','produtos','','show','clientes','','hide','cobranca','','hide','cobranca-sub1','','hide','usuario','','hide','empresa','','hide')"
    onmouseout="MM_showHideLayers('produtos','','hide')" cellSpacing="0" cellPadding="0"
    width="135" border="0">
    <tr>
    	<td><IMG height="2" src="image/space.gif" width="1"></td>
    </tr>
    <tr>
    	<td bgColor="#74b84b"><IMG height="1" src="image/space.gif" width="1"></td>
    </tr>
    <tr>
    	<td bgColor="#ffffff"><IMG height="1" src="image/space.gif" width="1"></td>
    </tr>
    <tr>
    	<td>
      <table class="box2" cellSpacing="0" cellPadding="0" width="135" border="0">
      	<tr>
        <td bgColor="#74b84b"><IMG height="5" src="image/space.gif" width="1"></td>
      	</tr>
      	<tr>
        <td bgColor="#ffffff">
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a>
        </td>
      	</tr>
      </table>
    	</td>
    </tr>
  	</table>
  </div>
  <div id="clientes" style="Z-INDEX: 100; LEFT: 347px; VISIBILITY: hidden; OVERFLOW: visible; WIDTH: 137px; POSITION: absolute; TOP: 80px; HEIGHT: 17px">
  	<table onmouseover="MM_showHideLayers('sistema','','hide','produtos','','hide','clientes','','show','cobranca','','hide','cobranca-sub1','','hide','usuario','','hide','empresa','','hide')"
    onmouseout="MM_showHideLayers('clientes','','hide')" cellSpacing="0" cellPadding="0"
    width="135" border="0">
    <tr>
    	<td><IMG height="2" src="image/space.gif" width="1"></td>
    </tr>
    <tr>
    	<td bgColor="#74b84b"><IMG height="1" src="image/space.gif" width="1"></td>
    </tr>
    <tr>
    	<td bgColor="#ffffff"><IMG height="1" src="image/space.gif" width="1"></td>
    </tr>
    <tr>
    	<td>
      <table class="box2" cellSpacing="0" cellPadding="0" width="135" bgColor="#ffffff" border="0">
      	<tr>
        <td bgColor="#74b84b"><IMG height="5" src="image/space.gif" width="1"></td>
      	</tr>
      	<tr>
        <td>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a>
        </td>
      	</tr>
      </table>
    	</td>
    </tr>
  	</table>
  </div>
  <div id="cobranca" style="Z-INDEX: 100; LEFT: 427px; VISIBILITY: hidden; OVERFLOW: visible; WIDTH: 137px; POSITION: absolute; TOP: 80px; HEIGHT: 17px">
  	<table width="135" border="0" cellpadding="0" cellspacing="0" onmouseover="MM_showHideLayers('sistema','','hide','produtos','','hide','clientes','','hide','cobranca','','show','cobranca-sub1','','hide','usuario','','hide','empresa','','hide')"
    onmouseout="MM_showHideLayers('cobranca','','hide','cobranca-sub1','','hide')">
    <tr>
    	<td><IMG height="2" src="image/space.gif" width="1"></td>
    </tr>
    <tr>
    	<td bgColor="#74b84b"><IMG height="1" src="image/space.gif" width="1"></td>
    </tr>
    <tr>
    	<td bgColor="#ffffff"><IMG height="1" src="image/space.gif" width="1"></td>
    </tr>
    <tr>
    	<td>
      <table class="box2" cellSpacing="0" cellPadding="0" width="135" bgColor="#ffffff" border="0">
      	<tr>
        <td bgColor="#74b84b"><IMG height="5" src="image/space.gif" width="1"></td>
      	</tr>
      	<tr>
        <td>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a>
        </td>
      	</tr>
      </table>
    	</td>
    </tr>
  	</table>
  </div>
  <div id="usuario" style="Z-INDEX: 100; LEFT: 601px; VISIBILITY: hidden; OVERFLOW: visible; WIDTH: 137px; POSITION: absolute; TOP: 80px; HEIGHT: 17px">
  	<table onmouseover="MM_showHideLayers('sistema','','hide','produtos','','hide','clientes','','hide','cobranca','','hide','cobranca-sub1','','hide','usuario','','show','empresa','','hide')"
    onmouseout="MM_showHideLayers('usuario','','hide')" cellSpacing="0" cellPadding="0"
    width="135" border="0">
    <tr>
    	<td><IMG height="2" src="image/space.gif" width="1"></td>
    </tr>
    <tr>
    	<td bgColor="#74b84b"><IMG height="1" src="image/space.gif" width="1"></td>
    </tr>
    <tr>
    	<td bgColor="#ffffff"><IMG height="1" src="image/space.gif" width="1"></td>
    </tr>
    <tr>
    	<td>
      <table class="box2" cellSpacing="0" cellPadding="0" width="135" bgColor="#ffffff" border="0">
      	<tr>
        <td bgColor="#74b84b"><IMG height="5" src="image/space.gif" width="1"></td>
      	</tr>
      	<tr>
        <td>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a><br>
        	<a href="#">menu</a>
        </td>
      	</tr>
      </table>
    	</td>
    </tr>
  	</table>
  </div>
  <div id="empresa" style="Z-INDEX: 100; LEFT: 231px; VISIBILITY: hidden; OVERFLOW: visible; WIDTH: 135px; POSITION: absolute; TOP: 80px; HEIGHT: 17px">
  	<table onMouseOver="MM_showHideLayers('sistema','','hide','produtos','','hide','clientes','','hide','cobranca','','hide','cobranca-sub1','','hide','usuario','','hide','empresa','','show')"
    onMouseOut="MM_showHideLayers('empresa','','hide')" cellSpacing="0" cellPadding="0"
    width="135" border="0" runat="server">
    <tr>
    	<td><IMG height="2" src="image/space.gif" width="1"></td>
    </tr>
    <tr>
    	<td bgColor="#74b84b"><IMG height="1" src="image/space.gif" width="1"></td>
    </tr>
    <tr>
    	<td bgColor="#ffffff"><IMG height="1" src="image/space.gif" width="1"></td>
    </tr>
    <tr>
    	<td>
      <table class="box2" cellSpacing="0" cellPadding="0" width="135" bgColor="#ffffff" border="0">
      	<tr>
        <td bgColor="#74b84b"><IMG height="5" src="image/space.gif" width="1"></td>
      	</tr>
      	<tr>
        <td>
        	<a href="#">menu</a>
        </td>
      	</tr>
      </table>
    	</td>
    </tr>
  	</table>
  </div>
  <iframe id="DivMestra" src="javascript:false;" scrolling="no" frameborder="0" style="position:absolute; top:0px; left:0px; display:none;"></iframe>
  <table cellSpacing="0" cellPadding="0" width="765" border="0">
  	<tr>
    <td vAlign="bottom" width="155" rowSpan="4"><a href="home.aspx"><IMG height="75" border="0" src="image/img_logo.gif" width="155"></a></td>
    <td vAlign="bottom" align="right" colSpan="14" height="53"><table cellSpacing="0" cellPadding="0" width="70%" border="0">
      <tr>
      	<td width="80" align="center" class="verdana8bold">&nbsp;</td>
      	<td width="15">&nbsp;</td>
      	<td width="2"><IMG height="21" src="image/img_separador.gif" width="2"></td>
      	<td width="15">&nbsp;</td>
      	<td class="verdana8bold" align="center">Olá</td>
      	<td width="15">&nbsp;</td>
      	<td width="2"><IMG height="21" src="image/img_separador.gif" width="2"></td>
      	<td width="15">&nbsp;</td>
      	<td width="58"><a href="home.aspx"><img src="image/ico_home.gif" width="58" height="18" border="0"></a></td>
      	<td width="15">&nbsp;</td>
      	<td width="2"><IMG height="21" src="image/img_separador.gif" width="2"></td>
      	<td width="15">&nbsp;</td>
      	<td width="60"><A href="JEWLOGINACE00101.aspx"><IMG alt="" src="image/img_logoff.gif" border="0" name="imglogoff"></A></td>
      	<td width="5">&nbsp;</td>
      </tr>
      <tr>
      	<td colSpan="13"><IMG height="8" src="image/space.gif" width="1"></td>
      </tr>
    	</table>
    </td>
  	</tr>
  	<tr>
    <td bgColor="#74b84b" colSpan="14"><IMG height="1" src="image/space.gif" width="1"></td>
  	</tr>
  	<tr>
    <td width="96" height="28">&nbsp;</td>
    <td width="71" onMouseOver="MM_showHideLayers('sistema','','hide','produtos','','hide','clientes','','hide','cobranca','','hide','cobranca-sub1','','hide','usuario','','hide','empresa','','show')"
    	onMouseOut="MM_showHideLayers('empresa','','hide')"><A href="#"><img src="image/menu2/menu_r2_c12.gif" border="0"></a></td>
    <td width="15">&nbsp;</td>
    <td onmouseover="MM_showHideLayers('sistema','','hide','produtos','','hide','clientes','','show','cobranca','','hide','cobranca-sub1','','hide','usuario','','hide','empresa','','hide')"
    	onmouseout="MM_showHideLayers('clientes','','hide')" width="68"><A href="#"><IMG height="28" src="image/menu2/menu_r2_c2.gif" width="68" border="0"></A></td>
    <td width="15">&nbsp;</td>
    <td onmouseover="MM_showHideLayers('sistema','','hide','produtos','','hide','clientes','','hide','cobranca','','show','cobranca-sub1','','hide','usuario','','hide','empresa','','hide')"
    	onmouseout="MM_showHideLayers('cobranca','','hide','cobranca-sub1','','hide')" width="78"><A href="#"><IMG height="28" src="image/menu2/menu_r2_c4.gif" width="78" border="0"></A></td>
    <td width="15">&nbsp;</td>
    <td onmouseover="MM_showHideLayers('sistema','','hide','produtos','','show','clientes','','hide','cobranca','','hide','cobranca-sub1','','hide','usuario','','hide','empresa','','hide')"
    	onmouseout="MM_showHideLayers('produtos','','hide')" width="75"><A href="#"><IMG height="28" src="image/menu2/menu_r2_c6.gif" width="75" border="0"></A></td>
    <td width="15">&nbsp;</td>
    <td onmouseover="MM_showHideLayers('sistema','','hide','produtos','','hide','clientes','','hide','cobranca','','hide','cobranca-sub1','','hide','usuario','','show','empresa','','hide')"
    	onmouseout="MM_showHideLayers('usuario','','hide')" width="65"><A href="#"><IMG height="28" src="image/menu2/menu_r2_c10.gif" width="65" border="0"></A></td>
    <td width="15">&nbsp;</td>
    <td onmouseover="MM_showHideLayers('sistema','','show','produtos','','hide','clientes','','hide','cobranca','','hide','cobranca-sub1','','hide','usuario','','hide','empresa','','hide')"
    	onmouseout="MM_showHideLayers('sistema','','hide')" width="67"><A href="#"><IMG height="28" src="image/menu2/menu_r2_c8.gif" width="67" border="0"></A></td>
    <td width="15">&nbsp;</td>
    <td width="1" bgColor="#74b84b" rowSpan="2"><IMG height="5" src="image/space.gif" width="1"></td>
  	</tr>
  	<tr>
    <td bgColor="#74b84b" colSpan="13"><IMG height="1" src="image/space.gif" width="10"></td>
  	</tr>
  	<tr>
    <td colSpan="15"><IMG height="1" src="image/space.gif" width="10"></td>
  	</tr>
  	<tr>
    <td bgColor="#858585" colSpan="15"><IMG height="5" src="image/space.gif" width="1"></td>
  	</tr>
  </table>
     <table width="765"  border="0" cellpadding="0" cellspacing="0">
          <tr>
            <td><form name="form1" method="post" action="">
              <select name="select">
                <option selected>selecioneselecineselecione</option>
              </select>
              <select name="select2">
                <option selected>selecioneselecineselecione</option>
              </select>
              <select name="select3">
                <option selected>selecioneselecineselecione</option>
              </select>
              <select name="select4">
                <option selected>seleciones</option>
                                          </select>
              <select name="select5">
                <option selected>seleciones</option>
              </select>
              <select name="select6">
                <option selected>seleciones</option>
              </select>
                        </form></td>
          </tr>
          <tr>
            <td>&nbsp;</td>
          </tr>
          <tr>
            <td>&nbsp;</td>
          </tr>
        </table>
	</body>
</HTML>

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152,1k
    • Posts
      651,8k
×
×
  • Criar Novo...