Suporte » Temas » Menu dropdown

Visualizando 7 respostas - 16 até 22 (de um total de 22)
  • Então o que mais lhe chama interessa é o efeito do menu?

    Para fazer o os sub-itens do menu “descer” com aquele efeito eu acho que seria preciso mudar os códigos do menu no header.php também!

    Então, queria colocar esse efeito e essas bordas do retangulo que aparece quando passa o mouse sobre.

    É bem parecido com esse que você criou, só mudar alguns detalhes (acho).

    Sim, deixar ele igual ao que você quer é facil, o dificil é fazer o spam em wordpress pro menu descer com aquele efeitinho ali 🙁

    Então deixa sem o efeito mesmo, quando colocar no ar tento fazer um com o efeito.

    Então, acredito que seja isso:

    /* =Menu
    -------------------------------------------------------------- */
    
    #access {
    	background: #FFF;
    	display: block;
    	float: left;
    	margin: 0 auto;
    	width: 940px;
    	margin-bottom: 3px;
    	margin-top: 3px;
    }
    #access .menu-header,
    div.menu {
    	font-size: 13px;
    	margin-left: 12px;
    	width: 928px;
    }
    #access .menu-header ul,
    div.menu ul {
    	list-style: none;
    	margin: 0;
    }
    #access .menu-header li,
    div.menu li {
    	float: left;
    	position: relative;
    }
    #access a {
    	color: #333;
    	display: block;
    	line-height: 38px;
    	padding: 0 10px;
    	text-decoration: none;
    }
    #access ul ul {
    	border:medium #006;
    	box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
    	-moz-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
    	-webkit-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
    	display: none;
    	position: absolute;
    	top: 38px;
    	left: 0;
    	float: left;
    	width: 200px;
    	z-index: 99999;
    }
    #access ul ul li {
    	min-width: 180px;
    }
    #access ul ul ul {
    	left: 100%;
    	top: 0;
    }
    #access ul ul {
    	margin-top: 6px !important;
    	background: #FFF;
    	line-height: 1em;
    	padding: 10px;
    	width: 180px;
    	height: auto;
    	-moz-border-radius: 10px; /* Para Firefox */
    	-webkit-border-radius: 10px; /*Para Safari e Chrome */
    	border-radius: 10px; /* Para Opera 10.5+*/
    	overflow:hidden;
    	border: 1px solid #ddd;
    }
    #access ul ul a {
    	background: #FFF;
    	line-height: 1em;
    	padding: 10px;
    	height: auto;
    	border-bottom: 1px solid #ddd !important;
    	-moz-border-radius: 0px; /* Para Firefox */
    	-webkit-border-radius: 0px; /*Para Safari e Chrome */
    	border-radius: 0px; /* Para Opera 10.5+*/
    }
    
    #access li a{
    	background: none;
    	color: #333;
    	border: 1px solid #fff;
    	-moz-border-radius: 10px; /* Para Firefox */
    	-webkit-border-radius: 10px; /*Para Safari e Chrome */
    	border-radius: 10px; /* Para Opera 10.5+*/
    	}
    
    #access li a:hover {
    	background: #eee;
    	color: #333;
    	border: 1px solid #ddd;
    	-moz-border-radius: 10px; /* Para Firefox */
    	-webkit-border-radius: 10px; /*Para Safari e Chrome */
    	border-radius: 10px; /* Para Opera 10.5+*/
    	}	
    
    #access ul ul :hover > a {
    	background: #FFF;
    	color:#E25534;
    	line-height: 1em;
    	padding: 10px;
    	height: auto;
    	border-color:#FFF;
    	border-bottom: 1px solid #ddd !important;
    	-moz-border-radius: 0px; /* Para Firefox */
    	-webkit-border-radius: 0px; /*Para Safari e Chrome */
    	border-radius: 0px; /* Para Opera 10.5+*/
    	}
    #access ul li:hover > ul {
    	display: block;
    }
    #access ul li.current_page_item > a,
    #access ul li.current-menu-ancestor > a,
    #access ul li.current-menu-item > a,
    #access ul li.current-menu-parent > a {
    	background: #eee;
    	color: #333;
    	border: 1px solid #ddd;
    	-moz-border-radius: 10px; /* Para Firefox */
    	-webkit-border-radius: 10px; /*Para Safari e Chrome */
    	border-radius: 10px; /* Para Opera 10.5+*/
    }
    * html #access ul li.current_page_item a,
    * html #access ul li.current-menu-ancestor a,
    * html #access ul li.current-menu-item a,
    * html #access ul li.current-menu-parent a,
    * html #access ul li a:hover {
    	color: #333;
    }
    
    /* =Content
    -------------------------------------------------------------- */

    Qualquer problema ou dúvida, é só chamar!!
    😀

    É isso mesmo que eu preciso, obrigado pela ajuda.

Visualizando 7 respostas - 16 até 22 (de um total de 22)
  • O tópico ‘Menu dropdown’ está fechado para novas respostas.