abrir con enlace un iframe en una zona especifica

[rzkgraphics]

Hola qué tal amigos de "forosdelweb.com" la verdad que soy un poco nuevo en esto de los foros, aunque realmente soy nuevo en esto, pero tengo uno que otro conocimiento básico de lo que he aprendido por mi cuenta, tanto en lo que es diseño digital y diseño web.

Bueno... ahora a lo que vengo. ( trataré de ser lo más claro jeje )

Tengo :

- una barra de navegación de 2 textos ( ejemplo1 y ejemplo2 )
- un contenedor div ( maincont ) que tiene a los divs ( izq y der )
- también tengo 2 páginas correspondientes a ejemplo1.html, ejemplo2.html y sobra.html

Lo que necesito :

Convertir esos 2 textos de la barra de navegación en enlaces que abran el contenido de las páginas en la zona del div "der" ya que en el izquierdo iría "predeterminadamente" sobra.html u otra información.

Lo que trato de con esto es que no cargue el LAYOUT o el diseño de mi web y solo cambie la información que en este caso solo son esas zonas las que cambian.

Agradezco de antemano su ayuda. Saludos! ;) ( Ah! olvidaba, no es que ofrezca algo a cambio, pero estoy interesado en personas que quieran tener amigos metidos en el diseño y aprender uno del otro, y más si requieren de ayudita en lo digital jejeje )

[maycolalvarez]

2 alternativas:

1-agregar un iframe en la zona especifica, y para dirigir los enlaces hacia él solo debes de añadir el atributo target="name_iframe" al link especifico, o desde javascript utilizando:

window.open("url","name_iframe");

2-con AJAX te evitas el iframe y puedes cambiar dinámicamente el contenido del div con innerHTML (tendrás que investigar sobre ajax al respecto)

[rzkgraphics]

Iniciado por maycolalvarez

2 alternativas:

1-agregar un iframe en la zona especifica, y para dirigir los enlaces hacia él solo debes de añadir el atributo target="name_iframe" al link especifico, o desde javascript utilizando:

window.open("url","name_iframe");

2-con AJAX te evitas el iframe y puedes cambiar dinámicamente el contenido del div con innerHTML (tendrás que investigar sobre ajax al respecto)

Maquetearé un poco esto para que en base a esto me ayuden. Gracias por tu aporte maycolalvarez , pero está algo resumido jeje necesito saber PORQUE.

Código HTML:

<div class="maincont">
<div class="navbar" style="height:50px; width:500px; border: 1px solid #00F;">
EJEMPLO1  EJEMPLO2
</div>
<div class="izq"  style="width:200px; height:400px; float:left; align:left; border: 1px solid #60F;">
sobra.html ( no cambia en EJEMPLO1 pero sí en EJEMPLO2 )
</div>
<div class="der"  style="width:500px; height:400px; align:rigth; border: 1px solid #C3C;">
ejemplo1.html
ejemplo2.html
( Dependiendo del enlace de la barra de navigación en el que estemos )
</div>
</div> 

[rzkgraphics]

Espero que alguien quiera ayudarme jeje

[rzkgraphics]

Seré algo paciente. :)

[rzkgraphics]

Mientras iré viendo en qué puedo ayudar en el foro.

[rzkgraphics]

Ufff movieron mi tema, pero se olvideron de responderme jeje

[emprear]

http://www.dynamicdrive.com/dynamici...jaxcontent.htm

[rzkgraphics]

Iniciado por emprear

[url]http://www.dynamicdrive.com/dynamicindex17/ajaxcontent.htm[/url]

jejeje se ve interesante y me parece que es lo que quiero, pero desearía una ayudita con eso.

[emprear]

Bureno, intenta con las instrucciones que ahi te dan, en todo caso, si aun no te funciona, lo vemos

Saludos

[rzkgraphics]

Amigos del foro! espero más propuestas suyas, de preferencia HTML ( este foro es sobre eso )

[rzkgraphics]

Iniciado por emprear

Bureno, intenta con las instrucciones que ahi te dan, en todo caso, si aun no te funciona, lo vemos

Saludos

Probado. Está muy buena tu ayuda bro, pero hay algunas cosillas que me interesan.
Aquí comienzo :


- Necesito que URLS DIRECTAS de los links de mis menues para poder compartirlos
- Quisiera que al dar click en uno de esos enlaces de mi menú se pudieran cambiar 1 o 2 divs en mi diseño.


Todo me funciona de 1000 maravillas pero quisiera más opción. Haber si me ayudas. :D

[emprear]

lo de las URLS directas, no se bien que quieres decir

Para cambiar el contenido de 2 divs, debes poner las funciones ajaxpage() que cargan individualmente en una función, y cargarla desde otro elemento

Archivo ajaxdd.js (aqui dentro pones el contenido de la script de dinamyc Drive

Archivo 2divs.html

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es" >
<head>
<title>2 Divs con Ajax</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="ES-ar" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta name="copyright" content="&copy; 2006, Guillermo Gianello" xml:lang="es" lang="es" />
<meta name="author" content="http://emprear.com"  xml:lang="es" lang="es" />
<script type="text/javascript" src="ajaxdd.js"></script> 
<style type="text/css">
/*<![CDATA[*/
 
p {
border: 2px solid #273018;
padding: 4px;
background-color:#789449;
color: #000;
font-size: 10pt;
font-weight: bold;
width: 120px;
text-align: center;
cursor: pointer;
}
 
#a, #b {
width :250px;
height: 150px;
border: 2px solid #273018;
color: #000;
font-size: 10pt;
font-weight: bold;
background-color:#9E933F;
margin-bottom: 10px;
}
 
/*]]>*/
</style>
 
<script type="text/javascript">
//<![CDATA[
function recarga(){
ajaxpage('a.html','a');
ajaxpage('b.html','b');
}
//]]>
</script>
</head>
<body>
<p onclick="recarga();">Cargar a y b</p>
<div id="a">
Div A
</div>
<div id="b">
Div B
</div>
<!-- ©2000 Emprear.com -->
</body>
</html>
 

archivo a.html

Código HTML:

<h1>A</h1>
 

archivo b.html

Código HTML:

<h1>B</h1>
 

Pone los 4 archivos en una carpeta.

Saludos

[rzkgraphics]

Iniciado por emprear

lo de las URLS directas, no se bien que quieres decir

Para cambiar el contenido de 2 divs, debes poner las funciones ajaxpage() que cargan individualmente en una función, y cargarla desde otro elemento

Archivo ajaxdd.js (aqui dentro pones el contenido de la script de dinamyc Drive

Archivo 2divs.html

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es" >
<head>
<title>2 Divs con Ajax</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="ES-ar" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta name="copyright" content="&copy; 2006, Guillermo Gianello" xml:lang="es" lang="es" />
<meta name="author" content="http://emprear.com"  xml:lang="es" lang="es" />
<script type="text/javascript" src="ajaxdd.js"></script> 
<style type="text/css">
/*<![CDATA[*/
 
p {
border: 2px solid #273018;
padding: 4px;
background-color:#789449;
color: #000;
font-size: 10pt;
font-weight: bold;
width: 120px;
text-align: center;
cursor: pointer;
}
 
#a, #b {
width :250px;
height: 150px;
border: 2px solid #273018;
color: #000;
font-size: 10pt;
font-weight: bold;
background-color:#9E933F;
margin-bottom: 10px;
}
 
/*]]>*/
</style>
 
<script type="text/javascript">
//<![CDATA[
function recarga(){
ajaxpage('a.html','a');
ajaxpage('b.html','b');
}
//]]>
</script>
</head>
<body>
<p onclick="recarga();">Cargar a y b</p>
<div id="a">
Div A
</div>
<div id="b">
Div B
</div>
<!-- ©2000 Emprear.com -->
</body>
</html>
 

archivo a.html

Código HTML:

<h1>A</h1>
 

archivo b.html

Código HTML:

<h1>B</h1>
 

Pone los 4 archivos en una carpeta.

Saludos

Lo probaré. Gracias por la ayuda de verdad se me está haciendo de mucha utilidad ;) y estoy aprendiendo un poco de esto jeje.

Lo de URL DIRECTA me refería a que por ejemplo :

si estoy en menú 1 : mi url sería http://midominio.com/menu1.html , pero con esto que estoy haciendo para la web, no puedo compartirlo así =/ alguna otra forma?

[rzkgraphics]

Ya está, con lo que me guié de lo ultimo que me dijiste y lo primero, solo llegué a la conclusión que tenía que agregar ajaxpage('a.html', 'div');); nada más que eso (:

En un rato subo parte de lo que he avanzado con tu ayuda, para que me entiendas un poco mejor lo que quisiera hacer. Saludos! Y MUCHAS GRACIAS!

[rzkgraphics]

(: Bueno, ya he avanzado gracias a tu ayuda, pero aún tengo par de inconvenientes, he subido mi proyecto a un host gratuito para que puedas apoyarme y entender mejro lo que estoy haciendo, espero tu respuesta para mandartelo y me sigas ayudando :)

[emprear]

postea la url para ver de que se trata

Saludos

[rzkgraphics]

Iniciado por emprear

postea la url para ver de que se trata

Saludos

http://rzkgraphics.webcindario.com/website/

Aparentemente todos mis enlaces del navbar cargan en maincont, pero no es así.
inicio, biografia, descargas y contacto(html) tienen su contenido dentro de un div llamado "rightcont" esto para que cuando haga el llamado no se situe en el "maincont", sino en el "rightcont" y me dejen libre "leftcont" donde quiero situar otro contenido, el mismo para todas las páginas mencionadas, en lo posible tratando de que no se vuelva a cargar.

Otro problema que tengo es que en mi zona "fotos" estoy usando un visor de imágenes con jquery, esto carga normal en su "foto.html", pero a la hora de hacer el llamado con su enlace para que se situe en maincont, este no carga como debe de ser a qué se debe?

[emprear]

rzkgraphics:


una explicación detallada creo llevaria varios posts.
Creo que deberías replanterate la estructura que estás usando.

Voy a darte una serie de detalles para orientarte.
tienes mas de 1MB de imágenes cargando al iniciar, sobre todo la que usas como fondo de todo
http://rzkgraphics.webcindario.com/images/principal.png

otras como
http://rzkgraphics.webcindario.com/i...annerkevin.png
parecen estar corruptas (se transfirieron mal probablemente) ya que el navegador la muestra truncada.

Cuando utilizas Ajax para cargar otras páginas que usan sus propias scripts, ó css, como la galeria de imágenes, tienes que cragar tambien el el js y css correspondiente (revisa la documentación de la script que te pasé para ver como se hace, mira atentamente el uso de Syntax of loadobjs())

Empieza por buscar como corregir eso
Saludos

[rzkgraphics]

Iniciado por emprear

rzkgraphics:


una explicación detallada creo llevaria varios posts.
Creo que deberías replanterate la estructura que estás usando.

Voy a darte una serie de detalles para orientarte.
tienes mas de 1MB de imágenes cargando al iniciar, sobre todo la que usas como fondo de todo
[url]http://rzkgraphics.webcindario.com/images/principal.png[/url]

otras como
[url]http://rzkgraphics.webcindario.com/images/headbanner/headbannerkevin.png[/url]
parecen estar corruptas (se transfirieron mal probablemente) ya que el navegador la muestra truncada.

Cuando utilizas Ajax para cargar otras páginas que usan sus propias scripts, ó css, como la galeria de imágenes, tienes que cragar tambien el el js y css correspondiente (revisa la documentación de la script que te pasé para ver como se hace, mira atentamente el uso de Syntax of loadobjs())

Empieza por buscar como corregir eso
Saludos

OTRO LINK
http://rzkgraphics.260mb.com

Bueno lo de la imagen principal, creo que tendré que bajarle mucho más aún. Gracias por el dato. La del headbanner, la verdad que sí me di cuenta del error, pero lo dejé ahí solo quiero ver que funcione bien lo otro.

Sobre lo del ajax, te quería consultar justamente eso! (I) osea voy a tener que agregar lo del load con el css y los js que usa la galería, pero porqué las demás zonas cogen el CSS del principal? sin que los carge?

La galería usa un js de jquery, tiene un galleria.js, al ultimo tengo un script que hace un llamado a galleria.classic.js pero también tengo un galleria.classic.css, estoy que pongo lo siguiente en mi enlace:

<a href="javascript:ajaxpage('../website/fotos.html', 'maincont'); loadobjs('sgallery.js', 'galleria.js','http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js', 'galleria.classic.js', 'galleria.classic.css');">Fotos</a>


Estoy bien?

[emprear]

En principio así debería ser, pero tendrias que ¡r probando para ver si funciona. A veces según como cargue el js, podria provocarte algun conflicto.

Otra posibilidad, aunque no se si tienes conocimientos de php, es crear una especie de plantilla que tenga tu header junto al menu, un pie, y que el contenido que varia se cargue a través de un include(quees una función fácil de implementar). Pero no olvides el tema de esa imagen de fondo, que insisto, a mi parecer es muy pesada

Otro detalle, que las scripts esten todas en tu server, no sé si ajax te permitirá cargar urls de otros servidor, lo digo por eso de
'http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js'
cuando ya tienes por otra parte

<script type="text/javascript" src="jquery.js"></script>

y siempre utiliza rutas relativas a la raiz del sitio para prevenir errores

Si tu web (y tomo como ejemplo la demo actual) es
http://rzkgraphics.webcindario.com

y tus imagenes estan en
http://rzkgraphics.webcindario.com/images

utiliza src="/images/...."
si las scripts o html estan en una carpeta de url
http://rzkgraphics.webcindario.com/website/

utiliza

/website/jquery.js
ó
/website/contacto.html




Saludos

[rzkgraphics]

Iniciado por emprear

En principio así debería ser, pero tendrias que ¡r probando para ver si funciona. A veces según como cargue el js, podria provocarte algun conflicto.

Otra posibilidad, aunque no se si tienes conocimientos de php, es crear una especie de plantilla que tenga tu header junto al menu, un pie, y que el contenido que varia se cargue a través de un include(quees una función fácil de implementar). Pero no olvides el tema de esa imagen de fondo, que insisto, a mi parecer es muy pesada

Otro detalle, que las scripts esten todas en tu server, no sé si ajax te permitirá cargar urls de otros servidor, lo digo por eso de
'http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js'
cuando ya tienes por otra parte

<script type="text/javascript" src="jquery.js"></script>

y siempre utiliza rutas relativas a la raiz del sitio para prevenir errores

Si tu web (y tomo como ejemplo la demo actual) es
[url]http://rzkgraphics.webcindario.com[/url]

y tus imagenes estan en
[url]http://rzkgraphics.webcindario.com/images[/url]

utiliza src="/images/...."
si las scripts o html estan en una carpeta de url
[url]http://rzkgraphics.webcindario.com/website/[/url]

utiliza

/website/jquery.js
ó
/website/contacto.html




Saludos

De nuevo muchas gracias por las recomendaciones.
Bueno mi galería normalmente la armo así :

Código:

<style>
.content{
	color:#006d99;
	width:700px;
	font-family: Tahoma;
	font-size: 14px;
	height: 400px;
	margin-top: 0px;
	margin-right: 5px;
	margin-bottom: 0px;
	margin-left: 7px;
	padding-top: 0px;
	padding-right: 5px;
	padding-bottom: 0px;
	padding-left: 5px;
}
a {color:#fff;}
#galleria{height:415px; width:739px;}
</style>

<script src="jquery.min.js"></script>
<script src="galleria.js"></script>


<div class="content">
<h1>Galeria de Fotos</h1>
<div id="galleria">

<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/f/f8/Sea-otter-morro-bay_13.jpg/800px-Sea-otter-morro-bay_13.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/7/70/Kuznetsk_Alatau_3.jpg/500px-Kuznetsk_Alatau_3.jpg">
<img alt="Strawberries, yum yum! Shiny red" src="http://upload.wikimedia.org/wikipedia/commons/thumb/d/de/Basket_of_strawberries_red_accent.jpg/500px-Basket_of_strawberries_red_accent.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/2/2d/Ns1-unsharp.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/6/67/Laser_effects.jpg/500px-Laser_effects.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/1/1b/PizBernina3.jpg/500px-PizBernina3.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/4/47/La_Galera_2.jpg/500px-La_Galera_2.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/9/92/Costa_rica_santa_elena_skywalk.jpg/500px-Costa_rica_santa_elena_skywalk.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/b/b2/Smoky_forest.jpg/500px-Smoky_forest.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/a/a9/Alcea_rosea_and_blue_sky.jpg/500px-Alcea_rosea_and_blue_sky.jpg">
</div>
</div>

    <script>
    Galleria.loadTheme('galleria.classic.js');
    $('#galleria').galleria();
    </script>

Todo eso dentro de una misma carpeta aparte de un "galleria.classic.css" que galleria.classic.js llama.


Ahora para lo que quiero he hecho lo siguiente :

<a href="javascript:ajaxpage('/website/fotos.html', 'maincont'); loadobjs('/website/sgallery.js', '/website/galleria.js','/website/jquery.min.js', '/website/galleria.classic.js', '/website/galleria.classic.css');">Fotos</a>

Donde sgallery.js es :
<script>
Galleria.loadTheme('galleria.classic.js');
$('#galleria').galleria();
</script>

Y jquery.min.js lo guardé dentro de la misma carpeta para que funcione y no me de problemas el ajaxpage.


Espero me puedas ayudar =/

[emprear]

rzkgraphics:

estuve experimentando un poco, y cereo que la puse hacer funcionar de la siguiente manera, pero es una solucion a medias

El html de la pagina principal

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" xml:lang="es" lang="es" >
<head>
<title>XHTML 1.0 transitional</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="ES" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<script type="text/javascript" src="js.js"></script>
<script type="text/javascript" src="jquery.js"></script>
</head>
<body>
 
<a href="javascript:ajaxpage('fotos.html', 'maincont');loadobjs('galleria.classic.css','galleria.js','galleria.classic.js','sgaleria.js')">Fotos</a>
<hr>
<div id="maincont">
 
</div>
 
</body>
</html>
 

el html de fotos.html

Código HTML:

<style>
.content{
    color:#006d99;
    width:700px;
    font-family: Tahoma;
    font-size: 14px;
    height: 400px;
    margin-top: 0px;
    margin-right: 5px;
    margin-bottom: 0px;
    margin-left: 7px;
    padding-top: 0px;
    padding-right: 5px;
    padding-bottom: 0px;
    padding-left: 5px;
}
a {color:#fff;}
#galleria{height:415px; width:739px;}
</style>
<div class="content">
<h1>Galeria de Fotos</h1>
<div id="galleria">
 
<img alt="Y se viene DON CHETA!" src="file:///C|/Users/Renato/Desktop/chezina.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/f/f8/Sea-otter-morro-bay_13.jpg/800px-Sea-otter-morro-bay_13.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/7/70/Kuznetsk_Alatau_3.jpg/500px-Kuznetsk_Alatau_3.jpg">
<img alt="Strawberries, yum yum! Shiny red" src="http://upload.wikimedia.org/wikipedia/commons/thumb/d/de/Basket_of_strawberries_red_accent.jpg/500px-Basket_of_strawberries_red_accent.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/2/2d/Ns1-unsharp.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/6/67/Laser_effects.jpg/500px-Laser_effects.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/1/1b/PizBernina3.jpg/500px-PizBernina3.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/4/47/La_Galera_2.jpg/500px-La_Galera_2.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/9/92/Costa_rica_santa_elena_skywalk.jpg/500px-Costa_rica_santa_elena_skywalk.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/b/b2/Smoky_forest.jpg/500px-Smoky_forest.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/a/a9/Alcea_rosea_and_blue_sky.jpg/500px-Alcea_rosea_and_blue_sky.jpg">
</div>
</div>
 

fijate que no carga ningun javascript ni css, solo el que est definido con <style>
y que la ruta de la primera imagenb tiene un error porque llama a file:///C...

La hice trabajar en mi localhost, con Firefox/ Chrome y Opera....
lo malo es que no funciona en IE (al menos a mi).
En IE solo funciona si llamas a fotos.html tal cual lo tenes ahora.

Habria que investigar un poco mas, pero no se. El error que marca IE es
"Galleria" no está definido (para las scripts 'galleria.classic.js' y 'sgalleria.js) intente poner sgalleria.js como <script></script> tanto en la pagina principal como en fotos.html, pero siguio tirando error, aunque en los demas navegadores se siguio ejecutando.

Por lo visto el problema es como cargarla desde ajax

Otra cosa no se me ocurre

Saludos

[rzkgraphics]

Iniciado por emprear

rzkgraphics:

estuve experimentando un poco, y cereo que la puse hacer funcionar de la siguiente manera, pero es una solucion a medias

El html de la pagina principal

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" xml:lang="es" lang="es" >
<head>
<title>XHTML 1.0 transitional</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="ES" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<script type="text/javascript" src="js.js"></script>
<script type="text/javascript" src="jquery.js"></script>
</head>
<body>
 
<a href="javascript:ajaxpage('fotos.html', 'maincont');loadobjs('galleria.classic.css','galleria.js','galleria.classic.js','sgaleria.js')">Fotos</a>
<hr>
<div id="maincont">
 
</div>
 
</body>
</html>
 

el html de fotos.html

Código HTML:

<style>
.content{
    color:#006d99;
    width:700px;
    font-family: Tahoma;
    font-size: 14px;
    height: 400px;
    margin-top: 0px;
    margin-right: 5px;
    margin-bottom: 0px;
    margin-left: 7px;
    padding-top: 0px;
    padding-right: 5px;
    padding-bottom: 0px;
    padding-left: 5px;
}
a {color:#fff;}
#galleria{height:415px; width:739px;}
</style>
<div class="content">
<h1>Galeria de Fotos</h1>
<div id="galleria">
 
<img alt="Y se viene DON CHETA!" src="file:///C|/Users/Renato/Desktop/chezina.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/f/f8/Sea-otter-morro-bay_13.jpg/800px-Sea-otter-morro-bay_13.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/7/70/Kuznetsk_Alatau_3.jpg/500px-Kuznetsk_Alatau_3.jpg">
<img alt="Strawberries, yum yum! Shiny red" src="http://upload.wikimedia.org/wikipedia/commons/thumb/d/de/Basket_of_strawberries_red_accent.jpg/500px-Basket_of_strawberries_red_accent.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/2/2d/Ns1-unsharp.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/6/67/Laser_effects.jpg/500px-Laser_effects.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/1/1b/PizBernina3.jpg/500px-PizBernina3.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/4/47/La_Galera_2.jpg/500px-La_Galera_2.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/9/92/Costa_rica_santa_elena_skywalk.jpg/500px-Costa_rica_santa_elena_skywalk.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/b/b2/Smoky_forest.jpg/500px-Smoky_forest.jpg">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/a/a9/Alcea_rosea_and_blue_sky.jpg/500px-Alcea_rosea_and_blue_sky.jpg">
</div>
</div>
 

fijate que no carga ningun javascript ni css, solo el que est definido con <style>
y que la ruta de la primera imagenb tiene un error porque llama a file:///C...

La hice trabajar en mi localhost, con Firefox/ Chrome y Opera....
lo malo es que no funciona en IE (al menos a mi).
En IE solo funciona si llamas a fotos.html tal cual lo tenes ahora.

Habria que investigar un poco mas, pero no se. El error que marca IE es
"Galleria" no está definido (para las scripts 'galleria.classic.js' y 'sgalleria.js) intente poner sgalleria.js como <script></script> tanto en la pagina principal como en fotos.html, pero siguio tirando error, aunque en los demas navegadores se siguio ejecutando.

Por lo visto el problema es como cargarla desde ajax

Otra cosa no se me ocurre

Saludos

Dale , voy a probarlo ahora yo ;) jejeje mas bien...si me dijeras cuánto tiempo te quedarás? o algo para contactarte y no esperar angustiado que me respondas? jeje

[emprear]

yo estoy todavia trabajando, pero son problemas que llevan tiempo, y no siempre se encuentra la solución. y una web no da par "angustiarse".... pero no te confies , a veces tampoco yo encuentro las soluciones... asi que andá preparando un "Plan B"....

Saludos

[rzkgraphics]

Iniciado por emprear

yo estoy todavia trabajando, pero son problemas que llevan tiempo, y no siempre se encuentra la solución. y una web no da par "angustiarse".... pero no te confies , a veces tampoco yo encuentro las soluciones... asi que andá preparando un "Plan B"....

Saludos

Hola otra vez emprear, jeje (: vengo a molestarte un poco más, pero esta vez con errores, la verdad es que no entiendo porqué ahora me da error en IE cuando me funcionaba normal, hasta la web que me mandaste funciona normal ( que raro ), pero bueno traté de hacer andar la galería pero no llegué a nada, es más traté de hacerlo tan igual a lo que hiciste tu, pero no llegué a nada, a ver si me das una mano otra vez, con estos problemitas.

LINK
http://www.sendspace.com/file/yi212c

[emprear]

Primero, solo funciona en firefox, la diferencia entre el que yo hice y el que enviaste en prueba.rar es la siguiente

el contenido de sgaleria.js deb ser este

Código Javascript:

Galleria.loadTheme('galleria.classic.js');
$('#galleria').galleria();
 

y vos le dejaste los <script></script>

y en fotos, hay que remover

<script src="jquery.min.js"></script>
<script src="galleria.js"></script>

ya que el primero se carga en el head del index.html y el segundo con el loadobjs() que está tambien en el index.html.

Ahora si dejas el fotos.html tal cual está SI va a funcionar en IE y Firefox, pero llamandolo directamente, no te va a funcionar utilizando el ajax de index.html

Otra solución posible es que uses un iframe en lugar del div+ajax


Saludos

[rzkgraphics]

Iniciado por emprear

Primero, solo funciona en firefox, la diferencia entre el que yo hice y el que enviaste en prueba.rar es la siguiente

el contenido de sgaleria.js deb ser este

Código Javascript:

Galleria.loadTheme('galleria.classic.js');
$('#galleria').galleria();
 

y vos le dejaste los <script></script>

y en fotos, hay que remover

<script src="jquery.min.js"></script>
<script src="galleria.js"></script>

ya que el primero se carga en el head del index.html y el segundo con el loadobjs() que está tambien en el index.html.

Ahora si dejas el fotos.html tal cual está SI va a funcionar en IE y Firefox, pero llamandolo directamente, no te va a funcionar utilizando el ajax de index.html

Otra solución posible es que uses un iframe en lugar del div+ajax


Saludos

Ya está, tenias razón se me pasó lo del script. Ya está corriendo normal. Imagínate que en un comienzo todo lo estaba haciendo con iframes, mi pregunta por la que empecé esta discusión era cómo abrir estos iframes con enlaces de acuerdo a mi zona del menú jeje (: pero bueno ya estoy en esto.

Me puedes ayudar en hacer que lo primero que cargue sea el inicio? porque si te das cuenta comienza en blanco. saludos!

http://rzkgraphics.260mb.com

[emprear]

Para que cargue por defecto, pones la script dentro del div

Código HTML:

<div id="maincont">
<script type="text/javascript">
//<![CDATA[
 
ajaxpage('inicio.html','maincont');
 
//]]>
</script>
</div>
 

solo la función con los parametros

Saludos

[rzkgraphics]

Iniciado por emprear

Para que cargue por defecto, pones la script dentro del div

Código HTML:

<div id="maincont">
<script type="text/javascript">
//<![CDATA[
 
ajaxpage('inicio.html','maincont');
 
//]]>
</script>
</div>
 

solo la función con los parametros

Saludos

Yeee (: dale mi broder ya está quedando ;) ahora solo me falta hacerme un reproductor con playlist y si se puede con xml para poder mi música en el div leftcont :B en las zonas de inicio,biografía y descargas. Y en el caso de contactos una imagen deferente a eso x)