Menú PHP con CSS utilizando $checkit = $_SERVER['PHP_SELF'];

fmurga · #1 (**permalink**) 31/03/2011, 15:05

Estoy intentando hacer funcionar un menú con php y css utilizando la variable $checkit = $_SERVER['PHP_SELF'];

Este es el código:

Código:

<? 
$checkit = $_SERVER['PHP_SELF']; 
echo '<li><a class="first" href="index.php"'; 
if(strstr($checkit,"index.php")) echo ' class="current active"'; 
echo '>Inicio</a></li>';
echo '<li><a href="servicios.php"'; 
if(strstr($checkit,"servicios.php")) echo ' class="current active"'; 
echo '>Servicios</a></li>';
echo '<li><a href="productos.php"'; 
if(strstr($checkit,"productos.php")) echo ' class="current active"'; 
echo '>Productos</a></li>';
echo '<li><a href="soluciones.php"'; 
if(strstr($checkit,"soluciones.php")) echo ' class="current active"'; 
echo '>Soluciones</a></li>'; 
echo '<li><a href="partners.php"'; 
if(strstr($checkit,"partnerts.php")) echo ' class="current active"'; 
echo '>Partners</a></li>';

?>

Lo llamo en cada página desde un php include.

No se por qué razón no me funciona. He revisado una y otra vez el código y veo que está bien.

Lo que no recuerdo es si tengo que colocar algo en las páginas para activarlo...

Lo tenía funcionando en un sitio anteriormente pero lo único que pude rescatar fue esta parte del script.

Gracias de antemano por su ayuda. Siento que el cerebro se me parte en dos...

pateketrueke · #2 (**permalink**) 31/03/2011, 15:07

prueba imprimir $checkit para conocer el valor real de dicha variable, sería bueno saberlo...

fmurga · #3 (**permalink**) 31/03/2011, 15:08

me da /directorio/archivo.php

pateketrueke · #4 (**permalink**) 31/03/2011, 15:17

bien, eso es bueno...

ahora... ¿cual es el HTML que se produce en el navegador?

fmurga · #5 (**permalink**) 31/03/2011, 15:37

Hmm.... está devolviendo esto:

Código:

<li><a class="first" href="index.php" class="current active">Inicio</a></li>

pero necesito que el "class="current active" lo asigne a

Código:

<li>

Esta es la parte del CSS:

Código:

#header ul.menu ul {display:none; top:50px; position:absolute; background:#fff; padding:14px 0}
#header ul.menu li a {display:block ; font-size:16px; color:#000; font-family:Arial, Helvetica, sans-serif; font-weight:bold; padding:14px 0 20px  ; width:165px; text-align:center; text-decoration:none }
#header ul.menu li a:hover {color:#fff; background:url(../images/hover_bg.gif) repeat-x  0 0;  }
#header ul.menu li.current >  a {color:#fff; background:url(../images/hover_bg.gif) repeat-x  0 0;  }
#header .menu > li.active > a {color:#fff !important; background:url(../images/hover_bg.gif) repeat-x  0 0;  }

pateketrueke · #6 (**permalink**) 31/03/2011, 15:41

es que entonces estas imprimiendo mal el HTML correspondiente, ¿ya te diste cuenta?

aunque también podrías modificar los CSS...

fmurga · #7 (**permalink**) 31/03/2011, 15:43

Sip, ya me di cuenta, pero ¿como declaro el class para el <li>?

Estoy desde las 8 am con esto y ya no me da el cerebro

pateketrueke · #8 (**permalink**) 31/03/2011, 15:47

yo cambiaría el CSS, sería lo mejor, y mas breve...

Cita:

li > a.current
li > a.active

fmurga · #9 (**permalink**) 31/03/2011, 15:52

Hola, lo he cambiado a esto:

Código:

#header ul.menu li a {display:block ; font-size:16px; color:#000; font-family:Arial, Helvetica, sans-serif; font-weight:bold; padding:14px 0 20px  ; width:165px; text-align:center; text-decoration:none }
#header ul.menu li a:hover {color:#fff; background:url(../images/hover_bg.gif) repeat-x  0 0;  }
#header ul.menu li > a.current >  a {color:#fff; background:url(../images/hover_bg.gif) repeat-x  0 0;  }
#header .menu > li > a.active > a {color:#fff !important; background:url(../images/hover_bg.gif) repeat-x  0 0;  }
#header .menu > li > ul li.current a:hover { color:#ee9d01 !important; background:url(../images/hover_bg.gif) repeat-x  0 0 !important;  }
#header ul.menu li.current  a.first, #header ul.menu li.active  a.first {color:#fff; background:url(../images/first_bg.gif) no-repeat  0 0 !important;  }
#header ul.menu li.current  a.last, #header ul.menu li.active  a.last {color:#fff; background:url(../images/last_bg.gif) no-repeat  100% 0 !important; }

Pero no funciona....

pateketrueke · #10 (**permalink**) 31/03/2011, 15:56

es obvio que no va a servir así como lo pones, ¿sabes algo de CSS?

Cita:

a.current > a

ya que estas reglas están mal, pues jamás habrá un <a/> dentro de otro <a/>

no es mi estilo, pero ya ni modo...

Cita:

#header ul.menu ul {display:none; top:50px; position:absolute; background:#fff; padding:14px 0}
#header ul.menu li a {display:block ; font-size:16px; color:#000; font-family:Arial, Helvetica, sans-serif; font-weight:bold; padding:14px 0 20px ; width:165px; text-align:center; text-decoration:none }
#header ul.menu li a:hover {color:#fff; background:url(../images/hover_bg.gif) repeat-x 0 0; }
#header ul.menu li > a.current {color:#fff; background:url(../images/hover_bg.gif) repeat-x 0 0; }
#header .menu > li > a.active {color:#fff !important; background:url(../images/hover_bg.gif) repeat-x 0 0; }

fmurga · #11 (**permalink**) 31/03/2011, 16:00

Si, pero ya fundí cerebro.

Te agradezco la ayuda, voy a despejarme un poco para volver a revisarlo y aplicar lo que sugieres.

Gracias!!!

GatorV · #12 (**permalink**) 31/03/2011, 18:23

Tema movido desde PHP a CSS

fmurga · #13 (**permalink**) 31/03/2011, 18:41

pateketrueke,

Gracias por tu ayuda. Ya estaba aturdido y no encontraba el error. Te comento que ya logré que me funcionara completo el menú.

Tenía un error en el código php y tenía que corregir otro par de líneas en el CSS.

Gracias por compartir tus conocimientos.