¿Se puede dejar estático el menú superior para siempre?

[marx-pola]

Hola gente! Quisiera saber eso, por ejemplo si el menu superior y el menu de la izquierda se pueden dejar estáticos en todo el sitio. Es impresindible que SOLO cambie la info central y que los menúes no cambien cuando selecciono algún link.

Quisiera saber las formas en que se pueden hacer. El sitio va a ser en PHP y bases de datos.

Mil gracias.

MArx.

[Raulmmmm]

Pues puedes poner un iframe donde vaya a estar el contenido, y ponerle a los enlaces el atributo target="iframe":
<iframe src="tupagina.html" width="100%" height="100%" id="iframe" name="iframe></iframe>

O puedes hacer una página que sólo contenga los menús y llamarla con PHP:
<?php
include('pagina.html');
?>

[hades87]

yo optaría personalmente por la segunda opción, ya que los firames van muy mal para posicionarte bien en buscadores y van contra la accesibilidad.

[marx-pola]

Gracias por la data. El problema que tengo es que en la parte superior tengo un flash con unos efectos y música que no tendría que resetearse cada vez que selecciono un link del menu. Por eso decia de usar un iframe en la parte central para que solo cambie la data que selecciono en cada link y el flash quede estático.

Creo que con el include sí se resetea la página, ¿puede ser?

Gracias a todos. Marx.

[hades87]

pues ahora mismo diría que sí, pero los frames no me acaban de gustar para nada, ya que te quitan indexación en los buscadores y atentan contra la accesibilidad.

[marx-pola]

Mmmm... no habrá otra forma de poder hacerlo? de dejar estática una parte de la web? Qué lástima si no se puede.

[Raulmmmm]

Creo que no la hay: para la música la única solución son los iframes o hacer toda la web en flash (todavía peor). Los includes te resetean la página.

[engranaje]

lo puedes hacer con ajax con la libreria XHConn.js

[Raulmmmm]

Ya, pero si lo hiciera con AJAX, tendría que cargar toda la web entera en un solo archivo, a menos que lo metiera en una base de datos, ¿me equivoco?. Y eso sería complicar aún más las cosas.

Yo recomendaría olvidar lo de la música, porque ya ves lo difícil que es que no se corte, y luego, además, a veces se escucha un pitido antes de cargar la música, y eso asusta. Si le quitas la música, lo puedes hacer con includes y ahorrar código.

[engranaje]

te ekivokas.... buska la libreria ke te digo....

[marx-pola]

Iniciado por Raulmmmm

Ya, pero si lo hiciera con AJAX, tendría que cargar toda la web entera en un solo archivo, a menos que lo metiera en una base de datos, ¿me equivoco?. Y eso sería complicar aún más las cosas.

Yo recomendaría olvidar lo de la música, porque ya ves lo difícil que es que no se corte, y luego, además, a veces se escucha un pitido antes de cargar la música, y eso asusta. Si le quitas la música, lo puedes hacer con includes y ahorrar código.

Raulmmmm: hice una parte con includes, pero la página se resetea igual. Esto mas que nada comenzó porque me pidieron que el flash no se resetee, no por la música q ahora es un tema, sino porque tiene una secuencia de fotos con efectos muy lindos y al resetearse, nunca termina. Por eso era mas que nada q no se resetee.
Trabajo con base de datos tambien, mas que nada por la lista de productos q contiene el sitio.

Voy a probarlo tambien a ver q resultados me trae.

Muchas gracias a todos.

Marx.

[engranaje]

proba kon esto..
la libreria te podes descargar de aka.... http://xkr.us/code/javascript/XHConn/XHConn.js
en el index... en el head mete esto...

<script type="text/javascript" language="javascript" src="XHConn.js"></script>
<script>
<!--
//inicializamos la libreria
var myConn = new XHConn();

//si no existe da error
if (!myConn) alert("XMLHTTP no disponible. Intenta un mejor browser.");

//funcion que se llama luego del include
var include_terminado = function (oXML) { document.getElementById('contenido').innerHTML = oXML.responseText; };

//funcion que hace el include
function include_dinamico (url)
{
//AJAX, llamo a la pagina y le mando los parametros
p=url
myConn.connect(p, "GET", "variable="+url, include_terminado);
}
</script>

en esta parte pones el id del div donde va kambiar el kontenido....
{ document.getElementById('contenido')

tu boton seria algo asi...
<a href="javascript:;" class="vinculo" onclick="include_dinamico('pagina2.html');">Pagina 2</a>

y para kargar la pagina ke kieres ver al inicio seria...
en el body
<body onload="include_dinamico('ini.html')">
y kreo ke es todo... ke te sirva... (no tiene el problema del include ke resetea la web)

[Raulmmmm]

Pues gracias por el aporte, engranaje, no sabía de esta tercera opción...

[marx-pola]

Iniciado por engranaje

en esta parte pones el id del div donde va kambiar el kontenido....
{ document.getElementById('contenido')

Gracias amigo por el dato, pero me quedó colgada esta parte... se me hizo un lio. ¿Dónde debo colocarlo, dentro del div... así como está?

Gracias.

[engranaje]

no... perdon.. no soy tan bueno explikando..
el div donde kieras ke se karge los kontenidos se debe llamar contenido
por ejemplo
<div id="contenido"> </div>
en ese div se va kambiar el contenido..

y si le kieres poner otro nombre lo kambias aki

//funcion que se llama luego del include
var include_terminado = function (oXML) { document.getElementById('AQUI VA EL ID DEL DIV').innerHTML = oXML.responseText; };

en el kodigo del head..

se entiende???

[jpunk]

no mucho.........


Hola Engranaje:

Tu aporte se ve muy interesante; pero la verdad me he perdido, podrías por favor colocar los códigos separados; porque el único archivo que entiendo es la librería llamada: XHConn.js

El index no lo entiendo tienes script donde cargamos la librería;

Y otro script que no dice que tipo es:

El archivo de contenido no lo veo con mucho sentido.

Podrías separar los archivos para hacernos una idea mas clara o alguna web de referencia que trate sobre esta librería.

Gracias de antemano.

[engranaje]

mmmm... el index kedaria algo asi..

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript" language="javascript" src="XHConn.js"></script>
<script>
<!--
//inicializamos la libreria
var myConn = new XHConn();

//si no existe da error
if (!myConn) alert("XMLHTTP no disponible. Intenta un mejor browser.");

//funcion que se llama luego del include
var include_terminado = function (oXML) { document.getElementById('contenido').innerHTML = oXML.responseText; };

//funcion que hace el include
function include_dinamico (url)
{
//AJAX, llamo a la pagina y le mando los parametros
p=url
myConn.connect(p, "GET", "variable="+url, include_terminado);
}
</script>
</head>
<body onload="include_dinamico('inicio.html')">
<div><a href="javascript:;" class="vinculo" onclick="include_dinamico('pagina1.html');">Pagina 1</a></div>
<div><a href="javascript:;" class="vinculo" onclick="include_dinamico('pagina2.html');">Pagina 2</a></div>
<div id="contenido"></div>
</body>
</html>

luego agregas la libreria XHConn.js en la misma carpeta donde esta tu index...

XHConn.js seria esto....(ojo guarda como XHConn.js)

/** XHConn - Simple XMLHTTP Interface - [email protected] - 2005-04-08 **
** Code licensed under Creative Commons Attribution-ShareAlike License **
** http://creativecommons.org/licenses/by-sa/2.0/ **/
function XHConn()
{
var xmlhttp, bComplete = false;
try { xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); }
catch (e) { try { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); }
catch (e) { try { xmlhttp = new XMLHttpRequest(); }
catch (e) { xmlhttp = false; }}}
if (!xmlhttp) return null;
this.connect = function(sURL, sMethod, sVars, fnDone)
{
if (!xmlhttp) return false;
bComplete = false;
sMethod = sMethod.toUpperCase();

try {
if (sMethod == "GET")
{
xmlhttp.open(sMethod, sURL+"?"+sVars, true);
sVars = "";
}
else
{
xmlhttp.open(sMethod, sURL, true);
xmlhttp.setRequestHeader("Method", "POST "+sURL+" HTTP/1.1");
xmlhttp.setRequestHeader("Content-Type",
"application/x-www-form-urlencoded");
}
xmlhttp.onreadystatechange = function(){
if (xmlhttp.readyState == 4 && !bComplete)
{
bComplete = true;
fnDone(xmlhttp);
}};
xmlhttp.send(sVars);
}
catch(z) { return false; }
return true;
};
return this;
}

y si jpunk hay varias paginas... busca en google libreria XHConn
ke les sirva.... en realidad esta muy facil (solo ke no c explikar bien) xD

[jpunk]

Engranaje:

Gracias de nuevo por responder:

Ahora si me funciono, pero creo que necesito buscar mas información al respecto, ya que con Ajax ha sido poco los encuentros, aun así tendré esa librería presente.

Muy buen aporte.

[marx-pola]

Iniciado por engranaje

mmmm... el index kedaria algo asi..

luego agregas la libreria XHConn.js en la misma carpeta donde esta tu index...

XHConn.js seria esto....(ojo guarda como XHConn.js)

/** XHConn - Simple XMLHTTP Interface - [email protected] - 2005-04-08 **
** Code licensed under Creative Commons Attribution-ShareAlike License **
** http://creativecommons.org/licenses/by-sa/2.0/ **/
function XHConn()
{
var xmlhttp, bComplete = false;
try { xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); }
catch (e) { try { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); }
catch (e) { try { xmlhttp = new XMLHttpRequest(); }
catch (e) { xmlhttp = false; }}}
if (!xmlhttp) return null;
this.connect = function(sURL, sMethod, sVars, fnDone)
{
if (!xmlhttp) return false;
bComplete = false;
sMethod = sMethod.toUpperCase();

try {
if (sMethod == "GET")
{
xmlhttp.open(sMethod, sURL+"?"+sVars, true);
sVars = "";
}
else
{
xmlhttp.open(sMethod, sURL, true);
xmlhttp.setRequestHeader("Method", "POST "+sURL+" HTTP/1.1");
xmlhttp.setRequestHeader("Content-Type",
"application/x-www-form-urlencoded");
}
xmlhttp.onreadystatechange = function(){
if (xmlhttp.readyState == 4 && !bComplete)
{
bComplete = true;
fnDone(xmlhttp);
}};
xmlhttp.send(sVars);
}
catch(z) { return false; }
return true;
};
return this;
}

Una pregunta... esta parte, cuando la visualizo en el explorador me aparece todo como texto. ¿Qué tags lleva?

Gracias.

[marx-pola]

Volví otra vez con un problemon. Hice todas las pruebas y funcionan bien, pero resulta que estoy llamando a otra página de mi sitio que contiene código javascript para cambiar fotos y si lo llamo con este método, no me funciona el otro, o sea, las fotos ya no cambian.

Este es es srcipt:

<script language="javascript">

var maxAncho = 334 //define la anchura máxima de la imagen
var maxAlto = 220 //define la altura máxima de la imagen
function fotilla(ancho,alto,cual)
{
if (ancho > alto) {forma = 'apaisada'}
if (ancho < alto) {forma = 'retrato'}
document.ima1.src = cual
if(forma == 'apaisada')
{
if(ancho > maxAncho)
{
porcientoAnchura = parseInt(maxAncho/ancho*100)
document.ima1.width = maxAncho
document.ima1.height = porcientoAnchura*alto/100
}
}
else if (forma == 'retrato')
{
if (alto > maxAlto)
{
porcientoAltura = maxAlto/alto*100
document.ima1.height = maxAlto
document.ima1.width = porcientoAltura*ancho/100
}
}
}
function cambia(cual)
{
document.ima2.src=cual
}
function inicio()
{
document.write('<div id="perico" style="position:absolute; width:1px; height:1px; z-index:1; overflow: hidden; visibility: hidden;"><img src="' + document.ima1.src + '" name="ima2" onload="fotilla(this.width,this.height,this.src)"> </div>')
}
</script>

Y el link es este:

a href="javascript:cambia('corporacion01gde.jpg')">< img src="corporacion01ch.jpg" width="100" height="75" border="0" class="cuadro-marcoBL"></a>
a href="javascript:cambia('corporacion02gde.jpg')">< img src="corporacion02ch.jpg" width="100" height="75" border="0" class="cuadro-marcoBL"></a>
etc...

Acá es donde deberían aparecer las fotos al hacer click en los links:

<div align="center">
<p><img src="corporacion01gde.jpg" name="ima1" width="334" height="320" id="ima1"></p>
<script language="JavaScript">inicio()</script>
</div>

El funcionamiento de esto pueden verlo acá:

http://www.corfam.com/index.php?id=1

La verdad, no entiendo por que no funciona ahora.
Gracias a todos.

Marx.

[marx-pola]

Chicos... ¿saben por qué no funciona este script cuando lo llamo con el ajax? Es raro... pero bue.

Gracias.
Marx.