Retroceder   Foros del Web > Diseño de Sitios web > Web general

Respuesta
 
Herramientas Desplegado
Antiguo 13-abr-2008, 14:52   #1 (permalink)
juanolo ha deshabilitado el karma
 
Fecha de Ingreso: abril-2008
Mensajes: 3
¿Como cambiar el contenido de un <div> al pinchar en un enlace?

Tengo una pagina principal llamada "ejemplo.php"
En ella tengo un <div> a la izquierda llamado "menu" y otro <div> a la derecha llamado "contenido".

En el div "menu" tengo un include que carga una pagina llamada "menu.php" con enlaces de menu.
En el div "contenido" tengo un include que carga una pagina llamada "contenido1.php".

La pregunta es...
¿Como puedo hacer para que al pulsar en un enlace del <div> "menu"... en el <div> "contenido" cargue una pagina diferente?
Es decir...
Pinchar en el enlace1 y que cargue el contenido1.php
Pinchar en el enlace2 y que cargue el contenido2.php
Pinchar en el enlace3 y que cargue el contenido3.php

La idea es hacer que los usuarios entren a las diferentes secciones de una web y que muestre la seccion en el div "contenido" sin que tenga que cargar toda la pagina.

¿Se puede hacer?¿Como?
¿Con php, con javascript?
¿Que codigo y de que manera tendria que ponerlo?

Aqui pongo el codigo de las paginas...


PAGINA PRINCIPAL "ejemplo.php"
Código PHP:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin t&iacute;tulo</title>

<style type="text/css">
<!--
@import url("estilo1.css");
-->
</style>
</head>

<body>
<div id="menu"><?php include("menu.php"); ?></div>
<div id="contenido"><?php include("contenido1.php"); ?></div>
</body>
</html>
PAGINA menu "menu.php" (son enlaces de ejemplo na mas)
Código PHP:
<a href="http://contenido1.php">Link1</a><br />
<
a href="http://contenido2.php">Link2</a><br />
<
a href="http://contenido3.php">Link3</a><br /> 
Y luego las paginas "contenido1.php" "contenido2.php" "contenido3.php" con contenido cualquiera mas la hoja de estilos css con la que coloco los divs y la cosa keda asi... http://i78.photobucket.com/albums/j88/lovelessboy8/lacosa.jpg
juanolo está desconectado   Responder Citando
Antiguo 13-abr-2008, 15:11   #2 (permalink)
hgp147 tiene algunos puntos positivos de karma
 
Avatar de hgp147
 
Fecha de Ingreso: diciembre-2006
Ubicación: Argentina
Mensajes: 675
Enviar un mensaje por MSN a hgp147
Re: ¿Como cambiar el contenido de un <div> al pinchar en un enlace?

Cita:
¿Se puede hacer?¿Como?
¿Con php, con javascript?
¿Que codigo y de que manera tendria que ponerlo?
Sí, se puede hacer. Así sería con AJAX:

PAGINA PRINCIPAL "ejemplo.php"

Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin t&iacute;tulo</title>

<style type="text/css">
<!--
@import url("estilo1.css");
-->
</style>
<script>
function nuevoAjax(){

    var xmlhttp=false;
    try {
    xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
    try {
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    } catch (E) {
    xmlhttp = false;
    }
    }

    if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
    xmlhttp = new XMLHttpRequest();
    }
    return xmlhttp;
    
} 




function Cargar(url){


var contenido = document.getElementById('contenido');
       
ajax=nuevoAjax(); 
ajax.open("GET", url,true); 
ajax.onreadystatechange=function(){

if(ajax2.readyState==4){

contenido.innerHTML=ajax.responseText;

}

}
        
ajax.send(null);



}
</script>
</head>

<body>
<div id="menu"><?php include("menu.php"); ?></div>
<div id="contenido"><?php include("contenido1.php"); ?></div>
</body>
</html>

PAGINA menu "menu.php"

Código PHP:
<a href="#" onclick="Cargar('contenido1.php');">Link1</a><br />
<
a href="#" onclick="Cargar('contenido2.php');">Link2</a><br />
<
a href="#" onclick="Cargar('contenido3.php');">Link3</a><br /> 
__________________
Spread Firefox | Download Day 2008
¡Únete en nuestra misión para alcanzar el Record Guinness al software más descargado en 24 horas! http://www.spreadfirefox.com/es-ES/worldrecord/

Última edición por hgp147; 13-abr-2008 a las 15:27.
hgp147 está desconectado   Responder Citando
Antiguo 13-abr-2008, 19:28   #3 (permalink)
designo no se puede cailificar en este momento
 
Avatar de designo
 
Fecha de Ingreso: marzo-2008
Ubicación: En la tierra del sol y del buen vino
Mensajes: 47
Enviar un mensaje por MSN a designo Enviar un mensaje por Skype™ a designo
Re: ¿Como cambiar el contenido de un <div> al pinchar en un enlace?

Hola esto lo haces con php de la siguiente manera:
Código PHP:
<?php
$recibe_pagina
=$_GET['pagina'];
?>
Haces esta declaración el el head, ya lo entenderas, luego haces los vinculos en los botones de tu menú quedaría algo asi:
Código HTML:
<td > <div ><a href="ejemplo.php?pagina=boton1">BOTON1</a></div></td>
<td ><div ><a href="ejemplo.php?pagina=boton2" >BOTON2</a></div></td>
<td ><div ><a href="ejemplo.php?pagina=boton3" >BOTON3</a></div></td>
y en el div del contenido haces un switch:
Código PHP:
 <?php
 
switch ($recibe_pagina){ 
 case 
"boton1":
   include (
"contenido1.php"); 
break;
case 
"boton2":
  include (
"contenido2.php"); 
break; 
case 
"boton3":
  include (
"contenido3.php"); 
break; 
default:
include (
"pordefecto.php"); <!-- aqui incluyes la pagina que por defecto aparecera si no se leccionan alguna de las otras-->
}
 
?>
espero que te sirva. Saludos, cualquier cosa estoy por acá.
__________________
www.designovisual.com.ar
designo está desconectado   Responder Citando
Antiguo 25-abr-2008, 11:17   #4 (permalink)
juanolo ha deshabilitado el karma
 
Fecha de Ingreso: abril-2008
Mensajes: 3
Re: ¿Como cambiar el contenido de un <div> al pinchar en un enlace?

Siento en haber tardado tanto en responder, la ocupacion... xD

Muchas gracias por vuestra ayuda, me han funcionado todas esas maneras de hacerlo, asike ya solo me falta elegir alguna ^^

Un saludo!
juanolo está desconectado   Responder Citando
Respuesta
No hay votos aún.


Herramientas
Desplegado

Normas de Publicación
No puedes crear nuevos temas
No puedes responder temas
No puedes subir archivos adjuntos
No puedes editar tus mensajes

BB code is Activado
Caritas están Activado
[IMG] está Activado
Código HTML está Desactivado


La Zona horaria es GMT -6. Ahora son las 02:05.


Message Board Statistics

LinkBacks Enabled by vBSEO 3.1.0

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93