Ayuda a poner un menu en todas las paginas

Hu3c0 · Enero 11, 2017, 10:11:10 AM

Hola amigo @No tienes permitido ver los links. Registrarse o Entrar a mi cuenta 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

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

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

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

kid_goth · Enero 11, 2017, 01:03:32 PM

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
@No tienes permitido ver los links. Registrarse o Entrar a mi cuenta 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.

@No tienes permitido ver los links. Registrarse o Entrar a mi cuenta, el index.html tengo uno puesto en las etiquetas <head>
Código: php
<head>
<script src="main.js"></script>
</head>
con este código:
Código: php
[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

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

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():

Código: javascript

$.get("menu.html", function(html_menu){
    $('body').prepend(html_menu);
});

o sea: quedaría así:

Código: 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();
	});

        // Asignar el menú al principio del body
        $.get("menu.html", function(html_menu){
            $('body').prepend(html_menu);
        });
}

Saludos

SoCu · Enero 11, 2017, 08:30:50 PM

@No tienes permitido ver los links. Registrarse o Entrar a mi cuenta 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.

@No tienes permitido ver los links. Registrarse o Entrar a mi cuenta 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:

Código: html5


	<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>

Código: html

...
<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:

Código: html5


<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.

Código: html5

<body>
<!--#include virtual="index.html"-->
</body>

Salu2.

kid_goth · Enero 12, 2017, 01:41:30 PM

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
@No tienes permitido ver los links. Registrarse o Entrar a mi cuenta 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.

@No tienes permitido ver los links. Registrarse o Entrar a mi cuenta 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:
Código: html5
	<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>
Código: html
...
<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:
Código: html5
<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.
Código: html5
<body>

</body>
Salu2.

Sí bro, eso sí, te toca poner el main.js en todas las páginas...

SoCu · Enero 12, 2017, 02:34:53 PM

@No tienes permitido ver los links. Registrarse o Entrar a mi cuenta 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.

kid_goth · Enero 12, 2017, 02:42:47 PM

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

SoCu · Enero 12, 2017, 03:57:03 PM

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:

Código: php

<a href="mnk_21_152.htm" target="_self">
o
<frame src="mnk_21_2.htm">

Salu2.

kid_goth · Enero 12, 2017, 05:52:38 PM

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.

SoCu · Enero 12, 2017, 07:40:22 PM

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.

SoCu · Enero 14, 2017, 02:40:49 PM

No hay nadie mas que pueda dar con la solución ?

Salu2.

Jimeno · Enero 14, 2017, 02:58:55 PM

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: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

SoCu · Enero 14, 2017, 03:27:09 PM

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.

Jimeno · Enero 14, 2017, 03:40:27 PM

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.

SoCu · Enero 14, 2017, 04:07:42 PM

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,

Código: php

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.

Ayuda a poner un menu en todas las paginas

Hu3c0

Enero 11, 2017, 10:11:10 AM #20

kid_goth

Enero 11, 2017, 01:03:32 PM #21

SoCu

Enero 11, 2017, 08:30:50 PM #22

kid_goth

Enero 12, 2017, 01:41:30 PM #23

SoCu

Enero 12, 2017, 02:34:53 PM #24

kid_goth

Enero 12, 2017, 02:42:47 PM #25

SoCu

Enero 12, 2017, 03:57:03 PM #26

kid_goth

Enero 12, 2017, 05:52:38 PM #27

SoCu

Enero 12, 2017, 07:40:22 PM #28

SoCu

Enero 14, 2017, 02:40:49 PM #29

Jimeno

Enero 14, 2017, 02:58:55 PM #30

SoCu

Enero 14, 2017, 03:27:09 PM #31

Jimeno

Enero 14, 2017, 03:40:27 PM #32

SoCu

Enero 14, 2017, 04:07:42 PM #33 Ultima modificación: Enero 14, 2017, 04:11:15 PM por SoCu