1
Aprender a programar desde cero / PHP y Javascript. Insertar código javascript en PHP problema tipo comillas
« en: 12 de Octubre 2015, 12:23 »
Hola a todos: no consigo hacer que se activen las funciones javascript al insertarlas dentro de código PHP.
¿Alguien me puede echar una mano?.
Lo que pretendo es que se activen los submenús al pasar el ratón.
Este es el código del archivo .php. Lo pego entero por si acaso.
Hay dos menús: el segundo <nav> hecho a "mano" que da el resultado que quiero conseguir haciéndolo con PHP.
Después, no creo que haga falta, pero por si acaso pego el código de la hoja de estilos. Dudo que el error esté en el CSS.
Muchas gracias de antemano.
______________________________________________________
Este es el CSS, que no creo que haga falta.
¿Alguien me puede echar una mano?.
Lo que pretendo es que se activen los submenús al pasar el ratón.
Este es el código del archivo .php. Lo pego entero por si acaso.
Hay dos menús: el segundo <nav> hecho a "mano" que da el resultado que quiero conseguir haciéndolo con PHP.
Después, no creo que haga falta, pero por si acaso pego el código de la hoja de estilos. Dudo que el error esté en el CSS.
Muchas gracias de antemano.
Código: [Seleccionar]
<?php
$menu_array=array( "Inicio",
"Servicios", array( "SubServ1",
"SubServ2"),
"Productos", array( "SubPro1",
"SubPro2",
"SubPro3"),
"Artículos", array( "SubArt1",
"SubArt2",
"SubArt3",
"SubArt4"),
"Contacto"
);
?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="generales.css">
<script src="lib/jquery-1.11.3.js"></script>
<title>Página base</title>
<script type="text/javascript">
function sMOver(NombreMenu) {
$('#'+NombreMenu+' li').addClass("subOver");
$('section').css('color','rgba(51,51,51,0.3)');
}
function sMOut() {
$('nav ul li ul li').removeClass("subOver");
$('section').css('color','rgba(51,51,51,1)')
}
</script>
</head>
<body>
<header>ENCABEZADO</header>
<nav>
<ul>
<?php
foreach ($menu_array as $iMenu=>$itemMenu) {
if(count($itemMenu)<2) {
$identificador="$itemMenu";
//ESTA LÍNEA ES DONDE NO CONSIGO QUE LAS FUNCIONES JAVASCRIPT "ME HAGAN CASO"
echo "<li class='menuPrin' onMouseOver='sMOver('".$itemMenu."')' onMouseOut='sMOut()'><a href='".$itemMenu.".php'>".$itemMenu."</a>";
// A PARTIR DE AQUÍ FUNCIONA COMO QUIERO (eso creo)
} else {
echo "<ul id='" .$identificador. "'>";
foreach($itemMenu as $iSubmenu=>$itemSub) {
echo "<li class='sub'><a href='".$itemSub.".php'>".$itemSub."</a></li>";
}
echo "</ul>";
echo "</li>";
}
}
?>
</ul>
</nav>
<br/><br/><br/>
<!--ESTO DA EL RESULTADO DESEADO, PERO CONSTRUYENDO EL MENÚ "A MANO"-->
<nav>
<ul>
<li class="menuPrin" onMouseOver="sMOver('Inicio')" onMouseOut="sMOut()"><a href="Inicio.php">Inicio</a></li>
<li class="menuPrin" onMouseOver="sMOver('Servicios')" onMouseOut='sMOut()'><a href="Servicios.php">Servicios</a>
<ul id='Servicios'>
<li class='sub'><a href='Subservi.php'>SubServi</a></li>
<li class="sub"><a href="#">Submenú2</a></li>
<li class="sub"><a href="#">Submenú3</a></li>
</ul>
</li>
<li class="menuPrin" onMouseOver="sMOver('Productos')" onMouseOut="sMOut()"><a href="#">Productos</a>
<ul id="Productos">
<li class="sub"><a href="#">SubProd</a></li>
<li class="sub"><a href="#">Submenú2</a></li>
<li class="sub"><a href="#">Submenú3</a></li>
</ul>
</li>
<li class="menuPrin">Artículos</li>
<li class="menuPrin">Contacto</li>
</ul>
</nav>
<section>
Lorem fistrum no te digo trigo por no llamarte Rodrigor apetecan ese que llega condemor benemeritaar te voy a borrar el cerito jarl. Quietooor no puedor fistro pecador. No puedor por la gloria de mi madre te va a hasé pupitaa mamaar hasta luego Lucas la caidita. A gramenawer apetecan no te digo trigo por no llamarte Rodrigor condemor. A peich te va a hasé pupitaa sexuarl al ataquerl jarl está la cosa muy malar está la cosa muy malar no puedor hasta luego Lucas. Va usté muy cargadoo apetecan condemor apetecan diodenoo se calle ustée ese que llega.
</section>
<footer>
</footer>
</body>
</html>
______________________________________________________
Este es el CSS, que no creo que haga falta.
Código: [Seleccionar]
@charset "utf-8";
/* CSS Document */
/*Generales*/
* {
margin:0;
padding:0;
border:0;
}
a {
text-decoration:none;
color:#000;
}
body {
font-size:1rem;
}
header, nav, section, footer {
max-width:98%;
}
/*Específicos*/
header {
margin:auto;
border:1px #000000 solid;
text-align:center;
margin-top:2rem;
}
li {
list-style-type: none;
margin-top:0.2rem;
}
.sub {
display:none;
}
.menuPrin {
display:inline-block;
vertical-align:top;
}
nav {
height:40px;
margin-left:1rem;
margin-top:1rem;
}
nav ul li {
width:200px;
border:1px solid #000;
}
nav ul li ul li a {
color:#FFF;
z-index:1;
padding:0.2rem 0 0 0.5rem;
}
section {
position: fixed;
height: 15%;
z-index:-1;
padding:0.1rem 1rem;
margin-top:1rem;
}
.subOver {
display:block;
background:rgba(0,0,0,1);
}