Foros del Web » Programando para Internet » PHP »

Problema problemita

Estas en el tema de Problema problemita en el foro de PHP en Foros del Web. Soy Literalmente nuevo en el asunto de Php, y he leído un poco, pero me ha tomado un poco de tiempo estoy utilizando el tema ...
  #1 (permalink)  
Antiguo 12/06/2014, 11:17
 
Fecha de Ingreso: junio-2014
Mensajes: 2
Antigüedad: 10 años, 1 mes
Puntos: 0
Problema problemita

Soy Literalmente nuevo en el asunto de Php, y he leído un poco, pero me ha tomado un poco de tiempo estoy utilizando el tema fizz.
Utiliza un menu con superfish... (deseo remover por completo ese menu y leído el codex, pero honestamente logro comprender muy poco)

Deseo utilizar este menu en ese tema. He avanzado mucho pero no lo suficiente. los menu aparecen uno al lado del otro y no como el ejemplo del css.

Así deseo que luzca el menu
Código HTML:
<html>
<head>
</head>
<style>
<style type="text/css">
}
.nav {
top: 300px;
left: 200px;
}
/* estilo de menu general */
.nav {
position: relative;
margin: 0;
padding: 0;
line-height: 22px;
}
/* Contenedor principal de los links de navegacion*/
.nav>li {
display: block;
float: left; /* Displaying them on the same line */
margin: 0;
padding: 0;
}
/* Principal link de navegacion */
.nav>li>a {
/* Layout */
display: block;
position: relative;
padding: 10px 20px;
/* Text */
font-family: "Open Sans Condensed", Arial, Helvetica, sans-serif;
color: #fff;
font-size: 22px;
text-decoration: none;
/* Background */
background: black; /* Para viejos navegadores*/
background: rgba(0, 0, 0, .6); /* fondo transparente */
/* El color cambia en el hover con la transición */
-webkit-transition: color .3s ease-in;
-moz-transition: color .3s ease-in;
-o-transition: color .3s ease-in;
-ms-transition: color .3s ease-in;
}
/* Cambiando el color en el hover */
.nav>li>a:hover, .nav>li:hover>a {
color: #0fd0f9;
}
/* Los enlaces que contienen menús desplegables son más anchas, porque tienen una pequeña flecha*/
.nav>.dropdown>a {
padding: 10px 30px 10px 20px;
}
/* La flecha que indica la lista desplegable */
.dropdown>a::after {
content: "";
position: absolute;
top: 17px;
right: 10px;
width: 7px;
height: 7px;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
border-bottom: 1px solid #fff;
border-right: 1px solid #fff;
}
/* Cambiando el color de la flecha del menu estacionario*/ 
.dropdown>a:hover::after, .dropdown:hover>a::after {
border-color: #0fd0f9;
}
/* Submenus */
.nav ul {
position: absolute;
margin: 0;
padding: 0;
list-style: none;
display: block;
}
/* Configuración de diseño generales para los contenedores de enlace de los submenús*/
.nav ul li {
position: absolute;
top: -9999px; /* ocultándolos*/
height: 0px;
display: block;
margin: 0;
padding: 0;
/* Haciendo que les permite ampliar su altura con una transición, por un efecto de diapositivas*/
-webkit-transition: height .2s ease-in;
-moz-transition: height .2s ease-in;
-o-transition: height .2s ease-in;
-ms-transition: height .2s ease-in;
}
/* Muestra los vínculos de submenú, mediante la expansión de sus contenedores (con una transición, definido previamente) y volviendo a colocar los*/
.dropdown:hover>ul>li {
height: 30px;
position: relative;
top: auto;
}
/* links del submenu*/
.nav ul li a {
/* Layout */
padding: 4px 20px;
width: 120px;
display: block;
position: relative;
/* Text */
font-family: "Open Sans Condensed", Arial, Helvetica, sans-serif;
color: #bbb;
text-decoration: none;
font-size: 16px;
/* Background & effects */
background: black;
background: rgba(0, 0, 0, .6);
-webkit-transition: color .3s ease-in, background .3s ease-in;
-moz-transition: color .3s ease-in, background .3s ease-in;
-o-transition: color .3s ease-in, background .3s ease-in;
-ms-transition: color .3s ease-in, background .3s ease-in;
}
/* Cambiar el color y fondo del enlace en vuelo estacionario */
.nav ul li:hover>a, .nav ul li a:hover {
color: #0fd0f9;
background: rgba(0, 0, 0, .75);
}
/* Hacer los submenús de nivel 2 (o superior) que aparezca en la parte derecha de su origen*/
.nav ul .dropdown:hover ul {
left: 160px;
top: 0px;
}
/* Los enlaces de submenú tienen una flecha diferente que indica otro submenú desplegable*/
.nav ul .dropdown a::after {
width: 6px;
height: 6px;
border-bottom: 0;
border-right: 1px solid #fff;
border-top: 1px solid #fff;
top: 12px;
}
/* Cambiando el color del hover de la flecha */
.nav ul .dropdown:hover>a::after, .nav ul .dropdown>a:hover::after {
border-right: 1px solid #0fd0f9;
border-top: 1px solid #0fd0f9;
}
</style>
<body>
<ul class="nav">
<li><a href="#">Inicio</a></li>
<li class="dropdown"> <a href="#">Trabajo</a>
<ul>
<li><a href="#">hola</a></li>
<li><a href="#">a veces</a></li>
<li><a href="#">Ejemplo</a></li>
<li><a href="#">Tal vez</a></li>
<li class="dropdown"> <a href="#">no lo se</a>
<ul>
<li><a href="#">nivel 2</a></li>
<li><a href="#">nivel 2</a></li>
<li><a href="#">nivel 2</a></li>
<li><a href="#">nivel 2</a></li>
<li class="dropdown"> <a href="#">nivel 2</a>
<ul>
<li><a href="#">nivel 3</a></li>
<li class="dropdown"> <a href="#">nivel 3</a>
<ul>
<li><a href="#">nivel 4</a></li>
<li><a href="#">nivel 4</a></li>
<li><a href="#">nivel 4</a></li>
</ul>
</li>
<li><a href="#">nivel 3</a></li>
<li><a href="#">nivel 3</a></li>
<li><a href="#">nivel 3</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li><a href="#">blah blah</a></li>
<li><a href="#">prueba</a></li>
<li><a href="#">jeje</a></li>
</ul>
</body>
</html> 
Actualmente esta así


Pero luce así, eso sin contar que el submenu no aparece debajo del menu. sino que siempre sale float:left; por la parte del logotipo ( por ejeplo, el menu de Doctrina mira por donde aparece)


No se donde realmente exponer el tema, ya que se basa en css junto con Php, no se si lo publique en el area que era, porque es como si tomara el css porque hace las animaciones pero, no sale ordenado como el ejemplo original. y relmente me he metido tanto con el css que creo que es un asunto del php, y con esa programacion del superfish menu y otros css. :/ creo que el superfish esta programado con el wpnavmenu del wordpress y es algo complicado, si alguien pudiera decirme como enlazar el menu ejemplo al tema Fizz de wordpress, por favor. Gracias, que me den una guia de como hacer eso porque cuando usan el superfish no es igual que un menu convencional, de solo un css y html. porque viene configurado con php.
  #2 (permalink)  
Antiguo 12/06/2014, 11:57
Avatar de hhs
hhs
Colaborador
 
Fecha de Ingreso: junio-2013
Ubicación: México
Mensajes: 2.995
Antigüedad: 11 años
Puntos: 379
Respuesta: Problema problemita

Yo creo que debes de solicitar que muevan tu mensaje al foro de CSS, por que no veo código php que pueda afectar lo que publicaste.
__________________
Saludos
About me
Laraveles
A class should have only one reason to change.
  #3 (permalink)  
Antiguo 12/06/2014, 12:51
 
Fecha de Ingreso: junio-2014
Mensajes: 2
Antigüedad: 10 años, 1 mes
Puntos: 0
Respuesta: Problema problemita

Este es el wpnavmenu.php
Código PHP:
<?php
/*********************************************************************************************

This theme uses wp_nav_menu() in one location.

*********************************************************************************************/
register_nav_menus(                              // wp3+ menus
        
array(
            
'main_nav' => 'The Main Menu',   // main nav in header
        
)
    );
    
function 
site5_main_nav($container,$menu_class) {
    
// display the wp3 menu if available
    
wp_nav_menu(
        array(
            
'menu' => 'main_nav'/* menu name */
            
'theme_location' => 'main_nav'/* where in the theme it's assigned */
            
'container' =>$container,
            
'menu_class' => $menu_class/* menu class */
            
'fallback_cb' => 'site5_main_nav_fallback' /* menu fallback */
        
)
    );
}

// this is the fallback for header menu
function site5_main_nav_fallback() {
    echo
'<ul class="sf-menu">';
    
wp_list_pages'title_li=&show_home=Home' );
    echo
'</ul>';
}

?>
Creo que este es el archivo que me tiene mal a pesar de que cambie las lineas del
Código PHP:
function site5_main_nav_fallback() {
    echo
'<ul class="sf-menu">'
por esta otra
Código PHP:
echo'<ul class="nav">'

Modifique el container y el menu class pero aun no veo que toma el menu original todo como tal.
___________________________________

Código PHP:
function site5_main_nav($container,$menu_class) {
    
// display the wp3 menu if available
    
wp_nav_menu(
        array(
            
'menu' => 'main_nav'/* menu name */
            
'theme_location' => 'main_nav'/* where in the theme it's assigned */
            
'container' =>$container,
            
'menu_class' => $menu_class/* menu class */
            
'fallback_cb' => 'site5_main_nav_fallback' /* menu fallback */
        

  #4 (permalink)  
Antiguo 13/06/2014, 14:25
Avatar de arcanisgk122  
Fecha de Ingreso: junio-2010
Mensajes: 755
Antigüedad: 14 años, 1 mes
Puntos: 28
Respuesta: Problema problemita

ok te explico:
Codigo de estilo y maquetacion: CSS.
Codigo de organisacion o DOM: HTML,
Codigo del lado del servidor: PHP

si es muy cierto php ayuda a cargar parte del HTML... ni php ni el HTML tiene algo que ver con donde salga el menu...

es puramente un problema de CSS y en este foro no te podremos ayudar.
__________________
Cooler Master Gladiator 600 - AMD PHENOM II X4 955 @ 3.5GHZ
GA-MA78GM-US2H - Super Talent 800 2GB x 2 Dual, (Unganged)
PSU Cooler Master eXtreme Power Plus 500W - Saphire R7-260OC-2GB

Etiquetas: html, problemita
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 06:56.