Hola, antes de nada, personar si este no es su sitio para preguntarlo, no sabía dónde ponerlo.
Os cuento... partiendo de que no se mucho de programación he visto un tutorial para crear un menú adaptable en html, y después de ponerle los links a las páginas web, he visto que ese menú desaparece cuando voy a la nueva página.
He intentado buscar ver soluciones y probarlas, pero una de dos, o no son para lo que quiero hacer, o lo estoy haciendo mal.
En alguna ocasión he podido ver el menú en la página que he puesto, pero lo he visto mal, ya que esa página tiene dos columnas, muestra dos páginas.
He visto también aquí otro post (https://underc0de.org/foro/dudas-generales-121/(solucionado)-utilizar-un-mismo-menu-en-todas-las-paginas-web/) sobre esto,
Pero las páginas que yo tengo son html, y también tengo que decir que las páginas web son para reproducirlas en el pc de forma local, no están ni estarán alojadas en un servidor.
Ya no sé qué más probar, si me podéis ayudar os lo agradecería.
No sé qué datos proporcionaros, ahora no estoy en casa, si queréis puedo subir unos archivos con el código en lugar de ponerlo aquí, ya que el menú utiliza también archivo *.js
Pues si quieres hacerlo con html tendrás que copiar el menu en todas las páginas.
También puedes usar php y que la página principal cargue en el centro el resto de las páginas con un include.
Saludos :D
Hola rollth, gracias por responder.
La pagina principal o la que tiene el menú tiene que ser HTML, porque estas paginas las voy a utilizar en otra aplicación, pero de momento este tema lo dejamos, no lo he querido comentar para no liarlo, aunque ésto lo tendría que preguntar por si ponen una nueva opción en esa aplicación.
Lo de copiar ese menú al resto de paginas, no se muy bien que código, si es todo o parte y donde tendría que copiarlo, aunque seria una tarea odiosa porque hay cientos de paginas.
He visto comentarios que dicen que copiando en el resto de paginas este código, el menú aparecería
<body>
<!--#include virtual="index.html"-->
</body>
en este caso aunque tendría que abrir pagina por pagina para pegarlo, lo veo mas sencillo porque solo seria una linea, pero no consigo que me funcione.
Tambien con este otro,
<body>
<iframe src="index.html" width=90% height=100% align="center" scrolling="no" frameborder="no" ></iframe>
</body>
o bien dentro de un DIV
<body>
<div>
<iframe src="index.html" width=90% height=100% align="center" scrolling="no" frameborder="no" ></iframe>
</div>
</body>
Pero se ve que soy un manazas porque tampoco no consigo nada
No se como adjuntar archivos al post, dejo un link con el codigo de lo que estoy haciendo, el menu cuando las paginas se utilizan por ejemplo una tablet, cambia para adaptase y esta escondigo y se muestra vertical.
https://drive.google.com/file/d/0B03vYREnP81iVUlocFZreHc4LWs/view?usp=sharing
P.D. donde esta en tu post el boton de dar las gracias que no lo veo.
Salu2.
Si pones terminación .php y añades esto al inicio de cada una te debería de salir el menú, aunque ya te digo que la otra forma de hacerlo en el index la veo mucho más simple, no entiendo el problema de usar .php en una aplicación.
<?php
include('index.html');
?>
Saludos, ya me comentarás que tal.
Si esa es otra opción que he visto, pero tu dices de poner menos al index.html a todas las demas paginas cambiarlas de extensión por PHP y poner ese codigo, si es así, tendria que cambiar tambien luego todos los link internos que llevan las paginas por php, y eso si que es una gran tarea, cosa que no podría hacer porque cuando cambie algo en las paginas y vuelva a crearlas, se vuelven a crear con html, y los link que llevan dentro también se cambiarían.
Como es la forma mas fácil de hacerlo, copiar el código del index.html en las demás paginas ?
Has visto link con las paginas que he subido ?
Te respondo también a lo de usar .php en una aplicación, como ten digo no quería mezclar temas y alargarme mucho en la explicación, pero veras, cuando consiga poner ese menu para que se muestre siempre en todas las paginas, voy a intentar crear una aplicación para android mediante esas paginas web, y la aplicación va a buscar o bien un index.html o index.htm, por eso lo de tener las paginas en html
Salu2.
@SoCu (https://underc0de.org/foro/index.php?action=profile;u=45348) lo que tu buscas es trabajar con frames, con los frames == en castellano creas un marco para que me comprendas estático si pulsas en los menus cambias uno de los frames pero los frames encabezados.menus, barras navegación, todo esto se queda inmutable.
Pero el problema que tenemos es la distancia si fueras mi vecino con gusto te ayudaba explicarte como hacerlo por este medio es bastante complicado y arduo
@Hu3c0 (https://underc0de.org/foro/index.php?action=profile;u=25363) si te bajas el archivo con el ejemplo de las paginas web que he puesto mas arriba, y le pones los frame que comentas, podrias repasar el codigo para ver que es lo que has puesto y donde, a ver si así puedo ver lo que tengo que hacer.
Lo que si he visto es algunos comentarios de gente que dice que es mejor usar iframe en lugar de frame, no se si es del todo cierto, no se si es por problemas con algunos navegadores.
Salu2.
Que tal :) !! , espero poder explicarte de la mejor forma posible :) !
lo que tendras que hacer es crear un nuevo documento Html que sera tu index y aparte el documento html para tu menu y otro para el resto de la pagina :) !
entonses supongamos que tenemos:
index.html
menu.html
cuerpo.html
en index.html tendras lo siguiente:
<html>
<head>
<Title>Inicio</Title>
</head>
<Frameset rows="30%,*" Frameborder="0" border="0">
<Frame name="opciones" src="menu.html" norsize>
<Frame name="principal" src="cuerpo.html" norsize>
</Frameset>
</html>
el atributo rows indica que la division sera en filas, y su valor es el porcentaje de la ventana que ocupara, los atributos frameborder y border con sus respectivos valores sirven para que no se vea la barra con la cual te guias cuando mueves la rueda del mouse no sea visible pues es poco estetica. ;)
los frame indican los datos del las divisiones , por eso colocamos primero el menu pues sera el que ocupara solo el 30 % del espacio le asignas un nombre y el archivo .htmlque mostrara la division en este caso el menu.html y posteriormente el resto de la pagina que ocupara el porcentaje restante, de la misma forma le asignas un nombre y el archivo que mostrara :) !
listo :) ! espero te sirva si tienes alguna duda dime :)! , saludos :) :) ;)
No tienes permitido ver los links.
Registrarse o Entrar a mi cuenta
Que tal :) !! , espero poder explicarte de la mejor forma posible :) !
lo que tendras que hacer es crear un nuevo documento Html que sera tu index y aparte el documento html para tu menu y otro para el resto de la pagina :) !
entonses supongamos que tenemos:
index.html
menu.html
cuerpo.html
en index.html tendras lo siguiente:
<html>
<head>
<Title>Inicio</Title>
</head>
<Frameset rows="30%,*" Frameborder="0" border="0">
<Frame name="opciones" src="menu.html" norsize>
<Frame name="principal" src="cuerpo.html" norsize>
</Frameset>
</html>
el atributo rows indica que la division sera en filas, y su valor es el porcentaje de la ventana que ocupara, los atributos frameborder y border con sus respectivos valores sirven para que no se vea la barra con la cual te guias cuando mueves la rueda del mouse no sea visible pues es poco estetica. ;)
los frame indican los datos del las divisiones , por eso colocamos primero el menu pues sera el que ocupara solo el 30 % del espacio le asignas un nombre y el archivo .htmlque mostrara la division en este caso el menu.html y posteriormente el resto de la pagina que ocupara el porcentaje restante, de la misma forma le asignas un nombre y el archivo que mostrara :) !
listo :) ! espero te sirva si tienes alguna duda dime :)! , saludos :) :) ;)
De +10
No lo hubiera podido hacer mejor esto es lo que le expliqué.
No tienes permitido ver los links.
Registrarse o Entrar a mi cuenta
No tienes permitido ver los links.
Registrarse o Entrar a mi cuenta
Que tal :) !! , espero poder explicarte de la mejor forma posible :) !
lo que tendras que hacer es crear un nuevo documento Html que sera tu index y aparte el documento html para tu menu y otro para el resto de la pagina :) !
entonses supongamos que tenemos:
index.html
menu.html
cuerpo.html
en index.html tendras lo siguiente:
<html>
<head>
<Title>Inicio</Title>
</head>
<Frameset rows="30%,*" Frameborder="0" border="0">
<Frame name="opciones" src="menu.html" norsize>
<Frame name="principal" src="cuerpo.html" norsize>
</Frameset>
</html>
el atributo rows indica que la division sera en filas, y su valor es el porcentaje de la ventana que ocupara, los atributos frameborder y border con sus respectivos valores sirven para que no se vea la barra con la cual te guias cuando mueves la rueda del mouse no sea visible pues es poco estetica. ;)
los frame indican los datos del las divisiones , por eso colocamos primero el menu pues sera el que ocupara solo el 30 % del espacio le asignas un nombre y el archivo .htmlque mostrara la division en este caso el menu.html y posteriormente el resto de la pagina que ocupara el porcentaje restante, de la misma forma le asignas un nombre y el archivo que mostrara :) !
listo :) ! espero te sirva si tienes alguna duda dime :)! , saludos :) :) ;)
De +10
No lo hubiera podido hacer mejor esto es lo que le expliqué.
Creo que esto es suficiente para dar como solucionado.
Si sigues teniedo dudas puedes continuar en este hilo.
Saludos.
No tienes permitido ver los links.
Registrarse o Entrar a mi cuenta
Que tal :) !! , espero poder explicarte de la mejor forma posible :) !
lo que tendras que hacer es crear un nuevo documento Html que sera tu index y aparte el documento html para tu menu y otro para el resto de la pagina :) !
entonses supongamos que tenemos:
index.html
menu.html
cuerpo.html
en index.html tendras lo siguiente:
<html>
<head>
<Title>Inicio</Title>
</head>
<Frameset rows="30%,*" Frameborder="0" border="0">
<Frame name="opciones" src="menu.html" norsize>
<Frame name="principal" src="cuerpo.html" norsize>
</Frameset>
</html>
el atributo rows indica que la division sera en filas, y su valor es el porcentaje de la ventana que ocupara, los atributos frameborder y border con sus respectivos valores sirven para que no se vea la barra con la cual te guias cuando mueves la rueda del mouse no sea visible pues es poco estetica. ;)
los frame indican los datos del las divisiones , por eso colocamos primero el menu pues sera el que ocupara solo el 30 % del espacio le asignas un nombre y el archivo .htmlque mostrara la division en este caso el menu.html y posteriormente el resto de la pagina que ocupara el porcentaje restante, de la misma forma le asignas un nombre y el archivo que mostrara :) !
listo :) ! espero te sirva si tienes alguna duda dime :)! , saludos :) :) ;)
Hola @Slenderhack,
Me parece muy buena la solución. Pero porque usar frame y no include() en PHP?
De esa forma podrías tener el menu.html y desde el index.php con la función include, incluyes el menú.
Saludos!
ANTRAX
Hola, solo quería daros nuevamente las gracias, porque ahora no puedo probarlo, voy a copiar la pagina y esta tarde en el curro lo pruebo porque ahí no tengo Internet.
Pero veo que tiene el mismo código que lleva una de las paginas que pongo en el ejemplo "rcf.html", que divide la pagina en dos columnas, he puesto esas paginas porque al tener dos columnas es donde mas problemas tengo para colocar el menu en la parte de arriba, esas paginas las lleva porque se trata de un manual con su menu independiente del principal, pero normalmente solo tiene una pagina donde tengo que colocar unas tablas, vamos que solo lleva lo que seria el cuerpo sin menu en el lado izquierdo.
El menú que pongo en el ejemplo se muestra en la parte superior, es el que se tiene que ver siempre, y cuando el navegador/pantalla cambie de tamaño por debajo de los 800px el menú se esconde y al pulsar en la parte superior se muestra por el lado izquierdo.
Si probáis ese ejemplo y poder visualizar el menú en forma de móvil puedes cambiar el tamaño horizontal de la ventana de tu navegador o en firefox presiona Ctrl + Shift + M, esto te abrirá el modo de visualización para diferentes pantallas y hay podrás jugar con el ancho de la ventana.
Salu2.
compañeros he querido hacer una prueba antes de marcharme, y la verdad que tenia ganas de ver si era esto lo que intento hacer, y asi liarme a modificar las paginas esta tarde, y por otro lado responderos desde casa porque odio escribir desde el movil.
Y creo que hay que quitar la etiqueta de [solucionado], como he comentado en el post anterior no es asi como tiene que trabajar el menú, por favor si miráis el archivo con las paginas que he puesto para no tener que escribir el codigo se puede ver como trabaja el ese menu.
Tengo un link de la pagina donde esta puesto tambien una demo, pero no lo he puesto por si meto la pata y pongo spam.
Salu2.
uffff oye oye, sé que los frames son (eran realmente) algo de utilidad, a estas alturas, no lo recomendaría usar... mejor como dice antrax usar include o require, en caso de no poder hacer uso de PHP siempre puedes trabajarlo con javascript. Por ejemplo con el load de jQuery, o así:
document.getElementById("div_del_menu").innerHTML='<object type="text/html" data="menu.html" ></object>';
Saludos
Hola, estoy buscando información de como poner los menús con el javascript, y creo que cada vez estoy destrozando mas la pagina :-[
en el index.html tengo este código
.
.
.
<body>
<div id="menu">
<header>
<div class="menu_bar">
<a href="#" class="bt-menu"><span class="icon-menu"></span>Menú</a>
</div>
<nav>
<ul>
<li><a href="index.html"><span class="icon-home"></span>Inicio</a></li>
<li><a href="RCF.html" ><span class="icon-briefcase"></span>RCF</a></li>
<li class="submenu">
<a href="#"><span class="icon-rocket"></span>Proyectos<span class="caret icon-down-open"></span></a>
<ul class="children">
<li><a href="#">SubElemento #1 <span class="icon-dot"></span></a></li>
<li><a href="#">SubElemento #2 <span class="icon-dot"></span></a></li>
<li><a href="#">SubElemento #3 <span class="icon-dot"></span></a></li>
</ul>
</li>
<li><a href="#"><span class="icon-globe"></span>Anagramas</a></li>
<li><a href="#"><span class="icon-mail"></span>Disposiciones</a></li>
</ul>
</nav>
</header>
</div>
</body>
.
.
.
Y en la pagina rcf.html
.
.
<head>
<title>RCF</title>
<script type="text/javascript" language="JavaScript">
funtion menu_alto() {
document.getElementById("menu").innerHTML='<object type="text/html" data="index.html" ></object>';
}
</script>
</head>
<script>
menu_alto()
</script>
.
.
.
y cuando en el index pulso en el botón RCF se muestra la otra pagina pero sin el menu, seguro que estoy haciendo algo mal
Salu2.
No tienes permitido ver los links.
Registrarse o Entrar a mi cuenta
No tienes permitido ver los links.
Registrarse o Entrar a mi cuenta
Que tal :) !! , espero poder explicarte de la mejor forma posible :) !
lo que tendras que hacer es crear un nuevo documento Html que sera tu index y aparte el documento html para tu menu y otro para el resto de la pagina :) !
entonses supongamos que tenemos:
index.html
menu.html
cuerpo.html
en index.html tendras lo siguiente:
<html>
<head>
<Title>Inicio</Title>
</head>
<Frameset rows="30%,*" Frameborder="0" border="0">
<Frame name="opciones" src="menu.html" norsize>
<Frame name="principal" src="cuerpo.html" norsize>
</Frameset>
</html>
el atributo rows indica que la division sera en filas, y su valor es el porcentaje de la ventana que ocupara, los atributos frameborder y border con sus respectivos valores sirven para que no se vea la barra con la cual te guias cuando mueves la rueda del mouse no sea visible pues es poco estetica. ;)
los frame indican los datos del las divisiones , por eso colocamos primero el menu pues sera el que ocupara solo el 30 % del espacio le asignas un nombre y el archivo .htmlque mostrara la division en este caso el menu.html y posteriormente el resto de la pagina que ocupara el porcentaje restante, de la misma forma le asignas un nombre y el archivo que mostrara :) !
listo :) ! espero te sirva si tienes alguna duda dime :)! , saludos :) :) ;)
Hola @Slenderhack,
Me parece muy buena la solución. Pero porque usar frame y no include() en PHP?
De esa forma podrías tener el menu.html y desde el index.php con la función include, incluyes el menú.
Saludos!
ANTRAX
Hola @ANTRAX , realmente yo no veo razon para no usar PHP, simplemente el compañero no queria utilizar PHP por eso opine por los frames ;) !
Saludos :) ;D
No tienes permitido ver los links.
Registrarse o Entrar a mi cuenta
Hola, estoy buscando información de como poner los menús con el javascript, y creo que cada vez estoy destrozando mas la pagina :-[
en el index.html tengo este código
tendría que de igual forma agregar el script a cada pag, no tienes un script general?, por ejemplo un main o algo así? si no es así, lo que puedes hacer es lo que hiciste del javascript, situarlo en un archivo aparte y a cada html solo le pondrías:
antes de que cierra la etiqueta </body>
...
<script type="text/javascript" src="miscript.js"></script>
</body>Saludos.
@Slenderhack (https://underc0de.org/foro/index.php?action=profile;u=53919) no es que quiera utilizar php, que posiblemente sea mejor solución, lo que pasa que como ya he comentado estas paginas las voy a utilizar para cargarlas en otra aplicación que se va a encargar de crear un apk, y esa aplicación solo admite el index.html o index.htm, ya lo he comentado al creador de esa aplicación a ver si se pueden poner index.php para una proxima actualización, pero mientras, y por si acaso no se pueda utilizar el index.php tendre que hacerlo si el.
@kid_goth (https://underc0de.org/foro/index.php?action=profile;u=9599), el index.html tengo uno puesto en las etiquetas <head>
<head>
<script src="main.js"></script>
</head>
con este código:
[code=javascript]$(document).ready(main);
var contador = 1;
function main () {
$('.menu_bar').click(function(){
if (contador == 1) {
$('nav').animate({
left: '0'
});
contador = 0;
} else {
contador = 1;
$('nav').animate({
left: '-100%'
});
}
});
// Mostramos y ocultamos submenus
$('.submenu').click(function(){
$(this).children('.children').slideToggle();
});
}
Y seria agregarle el siguiente codigo, no?
funtion menu_alto() {
document.getElementById("menu").innerHTML='<object type="text/html" data="index.html" ></object>';
}
Si es así, donde tengo mi duda es si esta bien puesto el texto menu en document.getElementById("menu") porque el menu no tenia ningun DIV y se lo puse yo, igual puede dar problemas.
No se si se paso por alto el link que puse mas arriba del archivos que contiene las paginas con el ejemplo, como veo que nadie ha comentado nada para hacer las pruebas, lo dejo aqui por si alguien quiere ver el ejemplo
https://drive.google.com/file/d/0B03vYREnP81iVUlocFZreHc4LWs/view?usp=sharing
Salu2.
Hola
@SoCu (https://underc0de.org/foro/index.php?action=profile;u=45348) ya te dije que por este medio es bastante compilicado ayudarte yo mi granito de arena lo voy a poner en hacerte comprender una cosa, que espero te sirva.
Tú tienes un div o un input en el html asi por ejemplo:
<div name="container" id="menu1"></div>
<input name="entrada" id="entrada" type="text" value="" placeholder="Rellene este campo"/>
Como puedes apreciar el div y el elemento input tienen cad uno un id === identificador
Pues cuando con javascript haces esto
var hu3c0=document.getElementById('entrada');
var hu3c0=document.getElementById('menu1');
Su traducción al lenguaje humano sería mete en la variable hu3co el elemento obtenido con el id el que sea.
Con esto estás creando un objeto de div o input para después trabajarlo
Ahora digo hu3c0.innerHtml()='<object type="text/html" data="index.html" ></object>';
Te traduzco al lenguaje humano en el espacio inerte html del objeto menu1 o entrada colocamé este objeto html
que te paso.
Después de esta breve explicación espero que comprendas a lo que preguntas que para que te funcione tu código
MENU tiene que ser un identificativo de tu html si no javascript no podrá encontrarlo.
@Saludos
Hola Hu3c0 entiendo que la ayuda presencial es mucho más efectiva porque estás viendo los cambios que puede ir haciendo, y tanto a ti como a los demás, os agradezco vuestra ayuda, pero en mi caso a no ser posible como a todos nos gustaría, como parece que no puede ser de otra forma, la única manera que veo es ésta.
Y lo que me explicas dentro de mis posibilidades más o menos puedo entenderlo, teniendo en cuenta de que programación como ya he comentado no sé, por eso para crear páginas web compre la aplicación website x5, que sin saber programar alguna cosa puedo hacer. Y claro cuando ya me sacan de ahí me encuentro perdido, y tengo que preguntar, y dentro de mis posibilidades entenderlo, por lo que tendré que leer varias veces lo que me dices, cosa que para ti puede ser lo más fácil del mundo.
Y como bien dices la distancia es un problema, por eso deje ese archivo por si querías modificarlo, y aunque no fuese presencial, pero por lo menos podía ver esos cambios en el código y ver cómo funciona, y si no entiendo nada preguntar, porque ya lo hice en la web de donde obtuve este código, pero hace dos años desde la última pregunta que hicieron y parece que no están por la labor de responder a lo que preguntan.
Salu2.
Hola amigo @SoCu (https://underc0de.org/foro/index.php?action=profile;u=45348) me encantaría poder ayudarte pero estoy en plena campaña final de mis estudios me quedan
mes y medio y tengo que entregar 15 Tareas según el protocolo estipulado , no puedo enturviarme con otras cosas
tengo que estar centrado en lo que tengo que estar. 15 tareas por 3 días cada una de ellas son 45 días y sólo tengo
tiempo hasta finales de febrero.
Pero no obstante voy a compartir contigo y con todo el Foro unos videotutoriales de Hernán Penas un chico argentino
el cual utiliza Web Builder 11 es toda una maravilla para gente que no tiene ni zorra idea de programación html.
Tengo que decir que para mí es el mejor programa WYSWYG (What you see what you get) de la red para gente que
no dispone de conocimientos html.
Sin más preámbulos si dispones de tiempo te paso un video extraordinario.
Te aconsejo ver este video primero
Creación Web Responsive (https://www.youtube.com/watch?v=oihYJQYGVJQ)
Aquí tienes la url de su canal de youtube creo haber visto un video que te puede interesar para lo que quieres hacer
ya que si no mal recuerdo hizo uno con un menú fijo para distintas web o algo así.
No pierdes nada con verlos quizás te saque de algún apuro el programa y los videos
Canal completo Hernán Pena (https://www.youtube.com/channel/UCkjR40YOyfhXWkTxLFIXY1Q)
No tienes permitido ver los links.
Registrarse o Entrar a mi cuenta
@Slenderhack (https://underc0de.org/foro/index.php?action=profile;u=53919) no es que quiera utilizar php, que posiblemente sea mejor solución, lo que pasa que como ya he comentado estas paginas las voy a utilizar para cargarlas en otra aplicación que se va a encargar de crear un apk, y esa aplicación solo admite el index.html o index.htm, ya lo he comentado al creador de esa aplicación a ver si se pueden poner index.php para una proxima actualización, pero mientras, y por si acaso no se pueda utilizar el index.php tendre que hacerlo si el.
@kid_goth (https://underc0de.org/foro/index.php?action=profile;u=9599), el index.html tengo uno puesto en las etiquetas <head>
<head>
<script src="main.js"></script>
</head>
con este código:
[code=javascript]$(document).ready(main);
var contador = 1;
function main () {
$('.menu_bar').click(function(){
if (contador == 1) {
$('nav').animate({
left: '0'
});
contador = 0;
} else {
contador = 1;
$('nav').animate({
left: '-100%'
});
}
});
// Mostramos y ocultamos submenus
$('.submenu').click(function(){
$(this).children('.children').slideToggle();
});
}
Y seria agregarle el siguiente codigo, no?
funtion menu_alto() {
document.getElementById("menu").innerHTML='<object type="text/html" data="index.html" ></object>';
}
Si es así, donde tengo mi duda es si esta bien puesto el texto menu en document.getElementById("menu") porque el menu no tenia ningun DIV y se lo puse yo, igual puede dar problemas.
No se si se paso por alto el link que puse mas arriba del archivos que contiene las paginas con el ejemplo, como veo que nadie ha comentado nada para hacer las pruebas, lo dejo aqui por si alguien quiere ver el ejemplo
https://drive.google.com/file/d/0B03vYREnP81iVUlocFZreHc4LWs/view?usp=sharing
Salu2.
OK, si todas las páginas tienen ese main.js... y ya viendo que tienes jQuery ¬¬
agrega esta función a tu main.js dentro de la function main():
$.get("menu.html", function(html_menu){
$('body').prepend(html_menu);
});o sea: quedaría así:
$(document).ready(main);
var contador = 1;
function main () {
$('.menu_bar').click(function(){
if (contador == 1) {
$('nav').animate({
left: '0'
});
contador = 0;
} else {
contador = 1;
$('nav').animate({
left: '-100%'
});
}
});
// Mostramos y ocultamos submenus
$('.submenu').click(function(){
$(this).children('.children').slideToggle();
});
// Asignar el menú al principio del body
$.get("menu.html", function(html_menu){
$('body').prepend(html_menu);
});
}Saludos
@Hu3c0 (https://underc0de.org/foro/index.php?action=profile;u=25363) estoy muy agradecido, lo primero es lo primero y tienes que dedicarles su tiempo a los estudios, te deseo suerte y que todo te salga bien, no te preocupes que por suerte contamos con más compañeros dispuestos a ayudar, y que tienen paciencia porque esto se me está atravesando.
Sobre el video la verdad que no vale de mucho porque son temas diferentes, pero gracias a ese video he podido conocer algo más esa aplicación, que voy a buscarla ya que con los esos videos en español vienen bien agente que no tiene ni idea de inglés, como es el caso.
@kid_goth (https://underc0de.org/foro/index.php?action=profile;u=9599) gracias también por tu ayuda y paciencia, pero pensaba que esta vez al ver el código que has puesto sería la definitiva, pero tampoco estoy consiguiendo nada, te cuento....
El archivo main.js solo lo tengo el index.html que es el que tiene el código del menú, pero bueno, me tocara poner el main.js página a página.
Aparte del main.js tengo más, que al ver que no me funcionaba también los he puesto en las tres páginas con las que estoy haciendo las pruebas, y son estos:
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<link rel="stylesheet" href="estilos.css">
<link rel="stylesheet" href="fontello.css">
<script src="jquery-latest.js"></script>
<script src="main.js"></script>Mas el código que has puesto en unos post más atrás:
antes de que cierra la etiqueta </body>
...
<script type="text/javascript" src="main.js"></script>
</body>Y no he conseguido que me mostrase los menús en todas las paginas, lo único que he cambiado del código que has puesto, fue el menu.html por index.html, ya que es esta la paginas que contiene el menú.
$.get("menu.html", function(html_menu){
$('body').prepend(html_menu);
Por cierto el html_menu no sera el ID del DIV porque tengo puesto este <div id="div_menu">, aunque lo he cambiado de nombre por <div id="html_menu"> y no me muestra el menu.
Por otro lado, como dices que hay que colocar ese código antes de cerrar la etiqueta </body>, te comento que hay una una pagina que no tiene las etiquetas <body>...</body>, y he probado a ponerlo arriba y abajo del codigo </head> y </html> pero tampoco muestra el menu, esa pagina tiene este código:
<html>
<head>
<title>RCF</title>
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<link rel="stylesheet" href="estilos.css">
<link rel="stylesheet" href="fontello.css">
<script src="jquery-latest.js"></script>
<script src="main.js"></script>
<script type="text/javascript" language="JavaScript">
function DoOnLoad()
{
}
function DoOnMainLoad()
{
var param = location.hash;
if (param.length != 0)
window.document.getElementById("right").src = param.substring(1);
}
</script>
</head>
<script type="text/javascript" src="main.js"></script>
<frameset cols="25%,*" framespacing="1">
<frame name="left" id="left" src="toc.html" frameborder="0">
<frame name="right" id="right" src="mnk_21_2.htm" frameborder="0" onload="DoOnLoad()">
<noframes>
Su navegador no maneja marcos! Esta característica es necesaria para ver este manual.
</noframes>
</frameset>
</html> He visto tambien ejemplos en los que ponen esto, lo he puesto y nada.
<body>
<!--#include virtual="index.html"-->
</body>Salu2.
No tienes permitido ver los links.
Registrarse o Entrar a mi cuenta
@Hu3c0 (https://underc0de.org/foro/index.php?action=profile;u=25363) estoy muy agradecido, lo primero es lo primero y tienes que dedicarles su tiempo a los estudios, te deseo suerte y que todo te salga bien, no te preocupes que por suerte contamos con más compañeros dispuestos a ayudar, y que tienen paciencia porque esto se me está atravesando.
Sobre el video la verdad que no vale de mucho porque son temas diferentes, pero gracias a ese video he podido conocer algo más esa aplicación, que voy a buscarla ya que con los esos videos en español vienen bien agente que no tiene ni idea de inglés, como es el caso.
@kid_goth (https://underc0de.org/foro/index.php?action=profile;u=9599) gracias también por tu ayuda y paciencia, pero pensaba que esta vez al ver el código que has puesto sería la definitiva, pero tampoco estoy consiguiendo nada, te cuento....
El archivo main.js solo lo tengo el index.html que es el que tiene el código del menú, pero bueno, me tocara poner el main.js página a página.
Aparte del main.js tengo más, que al ver que no me funcionaba también los he puesto en las tres páginas con las que estoy haciendo las pruebas, y son estos:
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<link rel="stylesheet" href="estilos.css">
<link rel="stylesheet" href="fontello.css">
<script src="jquery-latest.js"></script>
<script src="main.js"></script>
Mas el código que has puesto en unos post más atrás:
antes de que cierra la etiqueta </body>
...
<script type="text/javascript" src="main.js"></script>
</body>
Y no he conseguido que me mostrase los menús en todas las paginas, lo único que he cambiado del código que has puesto, fue el menu.html por index.html, ya que es esta la paginas que contiene el menú.
$.get("menu.html", function(html_menu){
$('body').prepend(html_menu);
Por cierto el html_menu no sera el ID del DIV porque tengo puesto este <div id="div_menu">, aunque lo he cambiado de nombre por <div id="html_menu"> y no me muestra el menu.
Por otro lado, como dices que hay que colocar ese código antes de cerrar la etiqueta </body>, te comento que hay una una pagina que no tiene las etiquetas <body>...</body>, y he probado a ponerlo arriba y abajo del codigo </head> y </html> pero tampoco muestra el menu, esa pagina tiene este código:
<html>
<head>
<title>RCF</title>
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<link rel="stylesheet" href="estilos.css">
<link rel="stylesheet" href="fontello.css">
<script src="jquery-latest.js"></script>
<script src="main.js"></script>
<script type="text/javascript" language="JavaScript">
function DoOnLoad()
{
}
function DoOnMainLoad()
{
var param = location.hash;
if (param.length != 0)
window.document.getElementById("right").src = param.substring(1);
}
</script>
</head>
<script type="text/javascript" src="main.js"></script>
<frameset cols="25%,*" framespacing="1">
<frame name="left" id="left" src="toc.html" frameborder="0">
<frame name="right" id="right" src="mnk_21_2.htm" frameborder="0" onload="DoOnLoad()">
<noframes>
Su navegador no maneja marcos! Esta característica es necesaria para ver este manual.
</noframes>
</frameset>
</html>
He visto tambien ejemplos en los que ponen esto, lo he puesto y nada.
<body>
<!--#include virtual="index.html"-->
</body>
Salu2.
Sí bro, eso sí, te toca poner el main.js en todas las páginas...
@kid_goth (https://underc0de.org/foro/index.php?action=profile;u=9599) si lo he puesto, y por si acaso hacia falta los demas, tambien los he puesto, pero como te digo no funciona, sigue sin mostrar el menu en las demas paginas.
Salu2.
momento... las rutas respecto a las otras páginas, por ejemplo si entán dentro de una carpeta esas otras páginas debes cambiar menu.html por ../menu.html y así may bro
No kid_goth, estan todas en la misma carpeta.
Estan en C:\capeta 1\Carpeta 2
Dentro de la "Carpeta 2" estan todos los archivos (html, css, js)
Y cuando pongo el link para abrir una pagina no tiene problemas para abrirse de esta forma:
<a href="mnk_21_152.htm" target="_self">
o
<frame src="mnk_21_2.htm">
Salu2.
Viste el error que sale? imagino que ejecutas el html con doble clic, usa por ejemplo lite-server o tu servidor local... tranquilo que cuando empaquetes la aplicación no te dará problema...
Saludos.
Lo de ejecutar con doble clic no se si te refieres la primera vez que para ver la paginas web index.html tengo que hacer doble clic en el PC, si que pulso dos veces sobre el archivo.
Pero la he subido a un servidor que me dejan y el menu se repite una y otra vez, cosa que en el pc no pasa.
Te paso el link por mp para que veas lo que pasa.
Salu2.
No hay nadie mas que pueda dar con la solución ?
Salu2.
No tienes permitido ver los links.
Registrarse o Entrar a mi cuenta
No hay nadie mas que pueda dar con la solución ?
Salu2.
No reinventes la rueda: http://www.menucool.com/ddmenu/one-menu-for-all-pages
Hola Jimeno, no se que quieres decir con ese de que no reinventes la rueda, no estoy inventando nada, creo que ya lo he comentado... no tengo ni idea de programación, así que poco puedo reinventar, solo he seguido como ya he dicho un toturial donde ponen el codigo y lo que intento es hacerle funcionar con las paginas que yo tengo y que no tiene menu, lo unico que quiero es ponerle ese menu, ni mas ni menos, pero cuando cargo una pagina el menu desaparece.
Gracias por ese link, pero mi ingles es nulo, aunque puedo ver los ejemplos, es mas o menos como lo que yo intento hacer.
Salu2.
No tienes permitido ver los links.
Registrarse o Entrar a mi cuenta
Hola Jimeno, no se que quieres decir con ese de que no reinventes la rueda, no estoy inventando nada, creo que ya lo he comentado... no tengo ni idea de programación, así que poco puedo reinventar, solo he seguido como ya he dicho un toturial donde ponen el codigo y lo que intento es hacerle funcionar con las paginas que yo tengo y que no tiene menu, lo unico que quiero es ponerle ese menu, ni mas ni menos, pero cuando cargo una pagina el menu desaparece.
Gracias por ese link, pero mi ingles es nulo, aunque puedo ver los ejemplos, es mas o menos como lo que yo intento hacer.
Salu2.
El link lo único que contiene es un paquete que hace exactamente lo que tú pides. Un menú centralizado para todas tus páginas. Ayúdate del traductor de Google y ve poco a poco. Espero que te sirva.
Con lo de la rueda me refiero a que no crees tú el menú desde 0 o siguiendo una guia. Si tu objetivo es tenerlo, no implementarlo, es mejor que cojas uno ya hecho y funcional y simplemente lo metas en tu web.
Bueno espero no cometer un error por poner otra pagina web aqui.
El menu no lo cree yo desde cero, como te digo... yo no tengo ni idea :( seguí los pasos de este tutorial y video, en esta pagina esta el codigo, así que yo solo lo copie, segui el video para saber que es lo que hace cada cosa,
http://www.falconmasters.com/web-design/menu-desplegable-adaptable-dispositivos-moviles/
Como ya he comentado la pagina no es para ponerla en ningún servidor.
Igual no me he explicado bien por no extenderme mucho, pero tengo una aplicación para windows donde le voy metiendo apuntes, documentos, manuales,etc, ésta aplicacion tiene la capacidad de poder exportar esa información en archivos HTM, pero sin menu.
Así que lo que intento es meter este menu en todas esas paginas web.
Volviendo a lo que dices, que veo que por lo menos tu si te has bajado ese archivo y lo has visto, si lo abres en en navegador, veras que en el menu si pulsas en RCF" te carga una pagina dividida en dos partes, pero el menu desaparece, por favor mira otra vez a ver si a ti tambien te desaparece.
P.D. kid_goth, te envie un mp, porque la pagina me avisaba que me enviaste un mp, pero era del otro dia y te volvi a responder.
Salu2.