Foros del Web » Creando para Internet » HTML »

Ayuda con galeria

Estas en el tema de Ayuda con galeria en el foro de HTML en Foros del Web. Alguien me podri decir a donde va la ruta. por ejemplo para mi la ruta de cada imagen iria aqui: 10. misImagenes [0]= "001.jpg"; pero ...
  #1 (permalink)  
Antiguo 15/03/2011, 20:35
 
Fecha de Ingreso: diciembre-2008
Mensajes: 198
Antigüedad: 9 años
Puntos: 1
Ayuda con galeria

Alguien me podri decir a donde va la ruta. por ejemplo para mi la ruta de cada imagen iria aqui: 10. misImagenes [0]= "001.jpg"; pero cuando le añado todas las rutas no me aparecen las imagenes.

El codigo es el siguiente:

01.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
02.<html xmlns="http://www.w3.org/1999/xhtml">
03.<head>
04.<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
05.<title>Parents Galler</title>
06.<script language="javascript">
07.//Array en la que debemos incluir
08.// la ruta a todas las imágenes de nuestro album
09.var misImagenes= new Array(3)
10. misImagenes [0]= "001.jpg";
11. misImagenes [1]= "002.jpg";
12. misImagenes [2]= "003.jpg";
13. misImagenes [3]= "004.jpg";
14.var i = 0;
15.//funcion de carga de la primera imagen
16.function cargarImagen(){
17. document.imgSrc.src = misImagenes[i] ;
18.}
19.function anterior(){
20. if(i<1){
21. var NumImagen = i
22. } else {
23. var NumImagen = i-=1;
24. }
25. document.imgSrc.src = misImagenes[NumImagen];
26.}
27.function siguiente(){
28. if(i>2){
29. var NumImagen = i
30. } else {
31. var NumImagen = i+=1;
32. }
33. document.imgSrc.src = misImagenes[NumImagen];
34.}
35.//Llamar a la función
36.window.onload=cargarImagen;
37.</script>
38.<style type="text/css">
39.body {
40. margin-top:40px;
41.}
42.td a {
43. font:9px Verdana, Arial, Helvetica, "sans-serif";
44. color:#FFFFFF;
45. text-decoration:none;
46.</style>
47.</head>
48.<body>
49.<div style="width:400px; height:300px; margin: auto;">
50.<img name="imgSrc" id="imgSrc" alt="ImÁgenes de la galeria">
51.</div>
52.<table width="400" border="0" cellspacing="0" cellpadding="0" style="background:#666; width:400px; margin: auto;">
53. <tr>
54. <td align="center"><a href="#" onClick="anterior();"> < Anterior</a></td>
55. <td align="center"><a href="#" onClick="siguiente();">Siguiente > </a></td>
56. </tr>
57.</table>
58.</body>
59.</html>

Gracias por la ayuda que me puedan ofrecer.
  #2 (permalink)  
Antiguo 15/03/2011, 21:46
Avatar de Naahuel  
Fecha de Ingreso: marzo-2011
Ubicación: localhost
Mensajes: 796
Antigüedad: 6 años, 8 meses
Puntos: 192
Respuesta: Ayuda con galeria

Agradecería que pongas mejor el código, es mucho trabajo quitar los números de línea para probarlo. Si ponés un código, podés usar las etiquetas que salen más arriba del editor del post quee dicen HIGHLIGHT, que permite que el código salga bien bonito.

Lo que si observo a simple vista es que declaraste mal el array de las imágenes. Vos pusiste esto:

Código Javascript:
Ver original
  1. var misImagenes= new Array(3)
  2. misImagenes [0]= "001.jpg";
  3. misImagenes [1]= "002.jpg";
  4. misImagenes [2]= "003.jpg";
  5. misImagenes [3]= "004.jpg";

El error es que estás declarando un array de 3 elementos pero le estás asignando 4 (¡el 0 también cuenta!). Lo más fácil es esto:

Código Javascript:
Ver original
  1. var misImagenes = ["001.jpg", "002.jpg", "003.jpg", "004.jpg"];

Que además es más fácil de mantener, pues sólo tiene que quitar o agregar elementos sin necesidad de modificar otra cosa.

Otro error a la vista es esto:
Código Javascript:
Ver original
  1. window.onload=cargarImagen

Pues así no se llama una función en JS. Lo correcto sería:

Código Javascript:
Ver original
  1. window.onload=cargarImagen();

A veces este sitio ayuda mucho a detectar errores:
http://www.jslint.com/

(en inglés)
  #3 (permalink)  
Antiguo 15/03/2011, 22:12
 
Fecha de Ingreso: diciembre-2008
Mensajes: 198
Antigüedad: 9 años
Puntos: 1
Respuesta: Ayuda con galeria

Gracias por contestar y disculpa por los numeros. yo tengo 14 imagenes para mostrar. el folder lo tengo en el desktop de la comp. el codigo sin numeros es:

<!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=iso-8859-1" />
<title>Parents Galler</title>
<script language="javascript">
//Array en la que debemos incluir
// la ruta a todas las imágenes de nuestro album
var misImagenes= new Array(3)
misImagenes [0]= "001.jpg";
misImagenes [1]= "002.jpg";
misImagenes [2]= "003.jpg";
misImagenes [3]= "004.jpg";
var i = 0;
//funcion de carga de la primera imagen
function cargarImagen(){
document.imgSrc.src = misImagenes[i] ;
}
function anterior(){
if(i<1){
var NumImagen = i
} else {
var NumImagen = i-=1;
}
document.imgSrc.src = misImagenes[NumImagen];
}
function siguiente(){
if(i>2){
var NumImagen = i
} else {
var NumImagen = i+=1;
}
document.imgSrc.src = misImagenes[NumImagen];
}
//Llamar a la función
window.onload=cargarImagen;
</script>
<style type="text/css">
body {
margin-top:40px;
}
td a {
font:9px Verdana, Arial, Helvetica, "sans-serif";
color:#FFFFFF;
text-decoration:none;
</style>
</head>
<body>
<div style="width:400px; height:300px; margin: auto;">
<img name="imgSrc" id="imgSrc" alt="ImÁgenes de la galeria">
</div>
<table width="400" border="0" cellspacing="0" cellpadding="0" style="background:#666; width:400px; margin: auto;">
<tr>
<td align="center"><a href="#" onClick="anterior();"> < Anterior</a></td>
<td align="center"><a href="#" onClick="siguiente();">Siguiente > </a></td>
</tr>
</table>
</body>
</html>
  #4 (permalink)  
Antiguo 15/03/2011, 22:21
Avatar de Naahuel  
Fecha de Ingreso: marzo-2011
Ubicación: localhost
Mensajes: 796
Antigüedad: 6 años, 8 meses
Puntos: 192
Respuesta: Ayuda con galeria

Pues a mi me funciona bien hombre. No hay dudas que hay algo mal en la ruta de las imágenes.
¿Las imágenes están en la misma carpeta que el archivo html?
También tené en cuenta lo que te dije antes.
  #5 (permalink)  
Antiguo 15/03/2011, 22:42
 
Fecha de Ingreso: diciembre-2008
Mensajes: 198
Antigüedad: 9 años
Puntos: 1
Respuesta: Ayuda con galeria

Gracias. No se que pasa. Lo pruebo en dreamweaver y tampoco. lo probe en dreamweaver por que lo que estaba usando era un editor que se llama webpagemaker. la pagina la hice en photoshop. Podra ser el editor?
  #6 (permalink)  
Antiguo 15/03/2011, 22:43
 
Fecha de Ingreso: diciembre-2008
Mensajes: 198
Antigüedad: 9 años
Puntos: 1
Respuesta: Ayuda con galeria

este es el codigo con la ruta de las imagenes:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Parents Galler</title>
<script language="javascript">
//Array en la que debemos incluir
// la ruta a todas las imágenes de nuestro album
var misImagenes= new Array(14)
misImagenes [0]= "C:\Documents and Settings\Macho\Desktop\misImagenes\000.jpg";
misImagenes [1]= "C:\Documents and Settings\Macho\Desktop\misImagenes\001.jpg";
misImagenes [2]= "C:\Documents and Settings\Macho\Desktop\misImagenes\002.jpg";
misImagenes [3]= "C:\Documents and Settings\Macho\Desktop\misImagenes\003.jpg";
misImagenes [4]= "C:\Documents and Settings\Macho\Desktop\misImagenes\004.jpg";
misImagenes [5]= "C:\Documents and Settings\Macho\Desktop\misImagenes\005.jpg";
misImagenes [6]= "C:\Documents and Settings\Macho\Desktop\misImagenes\006.jpg";
misImagenes [7]= "C:\Documents and Settings\Macho\Desktop\misImagenes\007.jpg";
misImagenes [8]= "C:\Documents and Settings\Macho\Desktop\misImagenes\008.jpg";
misImagenes [9]= "C:\Documents and Settings\Macho\Desktop\misImagenes\009.jpg";
misImagenes [10]= "C:\Documents and Settings\Macho\Desktop\misImagenes\010.jpg";
misImagenes [11]= "C:\Documents and Settings\Macho\Desktop\misImagenes\011.jpg";
misImagenes [12]= "C:\Documents and Settings\Macho\Desktop\misImagenes\012.jpg";
misImagenes [13]= "C:\Documents and Settings\Macho\Desktop\misImagenes\013.jpg";
misImagenes [14]= "C:\Documents and Settings\Macho\Desktop\misImagenes\014.jpg";
var i = 0;
//funcion de carga de la primera imagen
function cargarImagen(){
document.imgSrc.src = misImagenes[i] ;
}
function anterior(){
if(i<1){
var NumImagen = i
} else {
var NumImagen = i-=1;
}
document.imgSrc.src = misImagenes[NumImagen];
}
function siguiente(){
if(i>2){
var NumImagen = i
} else {
var NumImagen = i+=1;
}
document.imgSrc.src = misImagenes[NumImagen];
}
//Llamar a la función
window.onload=cargarImagen();
</script>
<style type="text/css">
body {
margin-top:40px;
}
td a {
font:9px Verdana, Arial, Helvetica, "sans-serif";
color:#FFFFFF;
text-decoration:none;
</style>
</head>
<body>
<div style="width:400px; height:300px; margin: auto;">
<img name="imgSrc" id="imgSrc" alt="ImÁgenes de la galeria">
</div>
<table width="400" border="0" cellspacing="0" cellpadding="0" style="background:#666; width:400px; margin: auto;">
<tr>
<td align="center"><a href="#" onClick="anterior();"> < Anterior</a></td>
<td align="center"><a href="#" onClick="siguiente();">Siguiente > </a></td>
</tr>
</table>
</body>
</html>
  #7 (permalink)  
Antiguo 16/03/2011, 00:00
Avatar de Naahuel  
Fecha de Ingreso: marzo-2011
Ubicación: localhost
Mensajes: 796
Antigüedad: 6 años, 8 meses
Puntos: 192
Respuesta: Ayuda con galeria

El script me funcionó a mi, las imagenes cargaron como corresponde y podía pasarlas.
El problema está en la ruta. Las imagenes que tenés ponelas en la misma carpeta que tu archivo HTML y pasá las rutas de la misma forma que hacías antes (o sea sólo el nombre).

Etiquetas: galeria
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 23:52.