Cambiar contenido sin cambiar de pagina

Pues lo que pretendia es que al pinchar en un enlace solo cambiase la parte de la informacion diferente a ambas webs (la de origen y la de destino)

Un ejemplo en esta web:

http://www.cdvillaverde.com/competiciones.html#

Estas en resultados y al pinchar en clasificacion solo cambia parte de la web, no tiene que volver a cargar toda la web entera.

Alguien puede decirme algun tutorial para poder hacer eso?

Saludos

Hola

eso se hace con marcos o frames

y son varias páginas, dentro de una sola

eso, yo lo se hacer solo con dreamweaver, que programa usas??

saludos

mejor no uses frames/marcos, los navegadores se montan un lío para indexar esas las páginas que los usan.

Usa tablas o divs. Con los divs se puede ahcer eso que pides aunque yo de momento aún soy un principiante con ellos.

Saludos :wink:

En realidad la pagina en cuestion, cambia toda completamente, cada uno de los links son paginas distintas, pero comparten el menu que es exactamente igual, solo cambia el contenido, ademas incorpora un script que precarga las imagenes del menu, es por eso que pareciera que no cambia, pero en realidad si lo hace.

serverdns escribió:En realidad la pagina en cuestion, cambia toda completamente, cada uno de los links son paginas distintas, pero comparten el menu que es exactamente igual, solo cambia el contenido, ademas incorpora un script que precarga las imagenes del menu, es por eso que pareciera que no cambia, pero en realidad si lo hace.

no me había dado cuenta de eso jeje.

Ole! :D

Yaneth escribió:eso, yo lo se hacer solo con dreamweaver, que programa usas??

saludos

Uso el dreamweaver CS3

serverdns escribió:En realidad la pagina en cuestion, cambia toda completamente, cada uno de los links son paginas distintas, pero comparten el menu que es exactamente igual, solo cambia el contenido, ademas incorpora un script que precarga las imagenes del menu, es por eso que pareciera que no cambia, pero en realidad si lo hace.

Con el menu de la izquierda si cambia la pagina. Pero dentro de ese menu de la izquierda si vas a competiciones/II torneo tertulias y ahi entras en los diferentes enlaces de la derecha fijate que no cambia la pagina, que es todo dentro de la misma.

Tienes Razon, En esa parte no cambia la pagina, eso se logra con la propiedad del estilo:


#Gaviotas-VIlla {
position:absolute;
width:707px;
height:373px;
z-index:24;
left: 249px;
top: 180px;
visibility: hidden;
}

Este es un fragmento del estilo, y todo lo que se estilo afecte esta oculto por la propiedad: visibility: hidden; , lo que se hace es cambiar esa propiedad con javascrip para que sea visible cuando precionen el boton del menu soperior correspondiente.

Este otro fracmento es visible porque se le a cambiado la propiedad con javascript:

#pumarada-villa {
position:absolute;
width:705px;
height:386px;
z-index:18;
left: 250px;
top: 186px;
visibility: visible;
}

Esa es la forma que usan en ese portal para ocultar contenido y mostrarlo solo cuando se preciona el boton correspondienye en el menu. 8) 8) 8)

Me perdi un poco. De java si que no tengo ni idea, pero todo en esta vida se puede aprender xD

Eso mejoraria el rendimiento (velocidad de navegacion) de mi pagina web? o no merece la pena?

Claro que mejoraria la navegacion, ya que todos los menus ocultos se cargarian la primera vez que se accede a la pagina en cuestion, todo el contenido que se muestra con el menu superior de esa pagina que mencionas, ya esta cargado en el navegador pero oculto ala vista, el java escrip lo que haces cambiar la propiedad de oculto a visible para que puedas ver, eso significa que no tiene que cargar ni actualizar nada, solo ocultar y desocultar.

Si mejoraria le velocidad de navegacion de tu pagina.

Hola. Hay manera de hacer lo de esta pagina en html-kit? Hay manera de ahcer que cambie de capa o mejor dicho, el contenido?
Gracias.

yo uso el dreamweaver 2004 y quiero saber lo mismo q neburss
que se cambie la informacion.. pero no los botones
saludos!

Pues eso esta echo con ajax ,una conbinacion de javascript,php y html .Aprender eso da pa rato...

alguien tiene algun tutorial o me podria decir como hacerlo ?
graz!

pues la verdad esque es muy dificil y tutoriales de esos solo hay pa quien queria aprender, ya que cada cosa es un mundo,aunque se puedan hacer maravillas con eso aqui dejo el enlace http://www.ajaxya.com.ar/temarios/descripcion.php?cod=9&punto=3

gracias.. mas o menos me sirvio.. seguire buscando mas..


saludos ;)

Gracias a las indicaciones que me disteis y al tutorial que pusite conseguí hacerlo. Ahora solo tengo un problema, al sacar la capa la pagina se desplaza arriba del todo, yo pretendia que quedase en la misma posicion. Al ocultar la capa la web queda en la posicion que estaba.

LA funcion utilizada es la siguiente:

addEvent(window,'load',inicializarEventos2,false);

function inicializarEventos2()
{
  var ob2=document.getElementById('enlace2');
  addEvent(ob2,'click',mostrarOcultarMensaje2,false);
  ob2=document.getElementById('mensaje2');
  addEvent(ob2,'click',mostrarOcultarMensaje2,false);
}

function mostrarOcultarMensaje2(e)
{  
 
  var ele=document.getElementById('mensaje2');
  if (ele.className=='mensajeoculto2')
     ele.className='mensajevisible2';
  else
     ele.className='mensajeoculto2';
}


function addEvent(elemento,nomevento,funcion,captura)
{
  if (elemento.attachEvent)
  {
    elemento.attachEvent('on'+nomevento,funcion);
    return true;
  }
  else  
    if (elemento.addEventListener)
    {
      elemento.addEventListener(nomevento,funcion,captura);
      return true;
    }
    else
      return false;
}

Es posible hacer lo que pretendo?

Mira no se si todavia les sirva el codigo yo ya lo hice y si me sale bien se los paso para que lo chequen:

function MM_findObj(n, d)
{ //v4.01
var p,i,x;
if(!d) d=document;
if((p=n.indexOf("?"))>0&&parent.frames.length)
{
d=parent.frames[n.substring(p+1)].document;
n=n.substring(0,p);
}
if(!(x=d)&&d.all)
x=d.all;
for (i=0;!x&&i<d.forms.length;i++)
x=d.forms;
for(i=0;!x&&d.layers&&i<d.layers.length;i++)
x=MM_findObj(n,d.layers.document);
if(!x && d.getElementById)
x=d.getElementById(n);
return x;
}
function MM_showHideLayers()
{ //v6.0
var i,p,v,obj,args=MM_showHideLayers.arguments;
for (i=0; i<(args.length-2); i+=3)
if ((obj=MM_findObj(args))!=null)
{
v=args[i+2];
if (obj.style)
{
obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v;
}
obj.visibility=v;
}
}
</script>

despues ya nada mas le damos en el menu que quieres:

<div id="menuizquierda">
<ul class="menu">
<h3>Menú
Ajo</h3>

Inicio

Ciclo

Precios

Mapa

Agenda

Regresar

</div>

para que se muestren o se oculten, en el archivo de css simplemente va lo siguiente:

#CicloAjo
{
position:absolute;
width:70%;
visibility:hidden;
height: 100%;
left: 382px;
}

Lo unico que no le he podido encontrar es si yo cambio la resolución de la pantalla se modifica el contenido que quiero mostrar, una forma de hacerlo que no cambie es poner la parte de POSITION:STATIC pero el defecto es que no queda el contenido exactamente en la misma posición quedaria un contenido y luego debajo de el otro y así y no deberia de quedar en la misma posición como lo muestra la página que ustedes pusieron de ejemplo ojala y alguien me pueda ayudar en eso gracias.


Cualquien duda dejo mi correo [correo eliminado]