← Javascript

Menu DropDown em JavaScript

Lida 2462 vezes

Offline

Diogo Oliveira 
Membro
Mensagens 1111 Gostos 3
Feedback +5

Troféus totais: 29
Trófeus: (Ver todos)
Windows User Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Poll Starter Level 5 Level 4 Level 3

Boas,

Eu tenho neste momento um menu dropdown em JavaScript / CSS. Acontece que o menu está configurado para funcionar de forma horizontal. Ou seja, ao passar com o rato num botão aparecem os submenus por baixo.

O que eu desejava agora, é que cada submenu contivesse outros submenos por dentro para o lado direito, se é que me faço entender.

Aqui vai um esquema que mostra o que quero (isto é só um esquema que fiz para mostrar, não liguem ao desenho):



O código que tenho neste momento é o seguinte.

JavaScript:

Código: [Seleccione]
<SCRIPT LANGUAGE="JavaScript">
<!--



var  timerId=0 ;



function clearTimer() {
  if (timerId!=0) {
    clearTimeout(timerId); timerId=0; }}



function startTimer() {
  clearTimer(); timerId=setTimeout('timerId=0;hideMenus()',200); }



function showMenu(menuNum) {
  clearTimer(); hideMenus();
  document.getElementById('menu_'+menuNum).style.display=""; }



function hideMenus() {

  var  i=1 ;

  while (document.getElementById('menu_'+i)) {
    document     .getElementById('menu_'+i).style.display="none";
    i++; }}



function hiLite(theOption) {
  clearTimer();
  document.getElementById('opt_'+theOption).style.background='#ff7800'; }



function unLite(theOption) {
  startTimer();
  document.getElementById('opt_'+theOption).style.background='#ffa04c'; }



function optClick(theOption) {
  unLite(theOption); clearTimer(); hideMenus();
  alert('Código JavaScript. //Por configurar'); }



//-->
</SCRIPT>

CSS:
Código: [Seleccione]
.popupMenu {
font-family     : Verdana,Tahoma,Helvetica,sans-serif;
font-size       :     12px;
color           :  #111111;
position        : absolute;
top             :     148px;
border          :      0px;
padding         :      0px;
z-index         :       16;
background-color:  #ffa04c;
cursor          :  pointer;
width: 108px;
}

Assim, agradecia que alguém me pudesse dizer ou modificar o código para colocar os submenus à direita (na vertical).

Ou, caso tenham outros códigos diferentes que aconselhem, estou disponível para os receber :P

Cumprimentos,

Diogo Oliveira.