Iniciar sesiónCerrar
Correo:
Contraseña:
Entrar
Recordar sesión en este navegador
Iniciar sesiónIniciar sesiónCrear cuentaCrear cuenta
LWP » Foros » JavaScript » Imagenes

JavaScript - Imagenes

Volver
Nuevo Tema
<<>>
 
Vista:

Imagenes

Publicado por Paul (3 intervenciones) el 28/07/2007 08:36:06
Hola y ante todos muchas gracias por tratar de ayudarme.
Mi pregunta es la sgte tengo el dibujo de una imagen al cual le asocie el onclick el cual deberia llamar a una funcion que se llame next la cual pasa a la siguiente imagen o al numero de imagen que el usuario escriba en el textbox. Alguien podria darme una mano de como seria esto.Por ejemplo al conjunto de imagenes la tengo en el directorio /var/www/fotos donde se encuentrabn las 80 imagen a mostar cuando el usuario presiona en la imagen next o debe pasar al numero de imagen que el usuario escribe en el textbox y luego presiona next y pasa al numero de uimagen que pidio el usuario
Muchas Gracias
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de ScriptShow
Val: 2.019
Plata
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

RE:Imagenes

Publicado por ScriptShow (692 intervenciones) el 29/07/2007 17:09:40
Saludos,

Un sencillo script:

<html>

<head>
<script language="JavaScript">
var Slides = new Array('imagen00.gif','imagen01.gif','imagen02.gif','imagen03.gif','imagen04.gif','imagen05.gif','imagen06.gif','imagen07.gif','imagen08.gif','imagen09.gif','imagen10.gif');
var NSlide = 0;

function prev() {
if (NSlide != 0) {NSlide--};
document.images['Imagen'].src = Slides[NSlide];
Message = 'Imagen ' + (NSlide) + ' de ' + Slides.length;
window.status = Message;
}
function next() {
if (NSlide != Slides.length-1) {NSlide++};
document.images['Imagen'].src = Slides[NSlide];
Message = 'Imagen ' + (NSlide) + ' de ' + Slides.length;
window.status = Message;
}
function text(NSlide) {
if (NSlide <= Slides.length-1) {
document.images['Imagen'].src = Slides[NSlide];
Message = 'Imagen ' + (NSlide) + ' de ' + Slides.length;
window.status = Message;
}
}
</script>
</head>

<body>
<form action="" onSubmit="text(this.elements[2].value);return false" name="SlideShow">
<img name="Imagen" src="imagen00.gif" width="200" height="200"><br><br>
<input type="button" name="Prev" value=" << " onClick="prev()">
<input type="button" name="Next" value=" >> " onClick="next()">
<input type="text" name="Text" value="" size="7"> <input type="submit" value="Buscar">
</form>
</body>

</html>

Puedes editar el Array para ampliar las imágenes y cambiar la ruta.

Ejemplo: /ruta-de-la-imagen/imagen-num.gif (para cada imagen).

¡Suerte!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

RE:Imagenes

Publicado por Paul (3 intervenciones) el 30/07/2007 00:26:34
Muchas Gracias por tu rspuesta
Pero yo no quiera poner una a una las imagenes en el array ya q es algo dinamico porque puede tener un dia 5 fotos y al otro dia 60 fotos
Estas fotos yo las tengo en por ejemplo /var/www y yo quiero que em liste sola una de als q estan en ese directorio y luego si el usuario presiona next pase a la siguiente o si pone el numero de imagen en el casillero pase a la indicada.
Como se haria eso ? Se aria asi ?

variable= /var/www
var Slides = new Array( "variable");

y despues todo el codigo q me generaste ???
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de ScriptShow
Val: 2.019
Plata
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

RE:Imagenes

Publicado por ScriptShow (692 intervenciones) el 30/07/2007 23:08:34
Saludos, Paul.

Esta es una forma que puede servir:

<html>

<head>
<script language="JavaScript">
var Slides = '/var/www/Imagen';
var NSlide = 0;

function prev() {
if (NSlide > 000) {NSlide--};
document.images['Imagen'].src = Slides+[NSlide]+'.gif';
Message = ' Imagen '+[NSlide];
window.status = Message;
}
function next() {
if (NSlide < 100) {NSlide++};
document.images['Imagen'].src = Slides+[NSlide]+'.gif';
Message = ' Imagen '+[NSlide];
window.status = Message;
}
function text(NSlide) {
if (NSlide >= 000 && NSlide <= 100) {
document.images['Imagen'].src = Slides+[NSlide]+'.gif';
Message = ' Imagen '+[NSlide];
window.status = Message;
}
}
</script>
</head>

<body>
<form action="" onSubmit="text(this.elements[2].value);return false" name="SlideShow">
<img name="Imagen" src="imagen00.gif" width="200" height="200"><br><br>
<input type="button" name="Prev" value=" << " onClick="prev()">
<input type="button" name="Next" value=" >> " onClick="next()">
<input type="text" name="Text" value="" size="7"> <input type="submit" value="Buscar">
</form>
</body>

</html>

Todas las imágenes se llamarán: Imagen1.gif, Imagen2.gif, Imagen....

También puedes editar la variable:

var Slides = '/var/www/Imagen'

y nombrarlas según necesidad. Hemos puesto un límite de 0 - a -100 imágenes, pero esto no quiere decir nada; es perfectamente modificable.
Una cosa... cuando alguien llame una imagen que no existe, quedará el sitio vacio. Ten en cuenta que en un margen como el que quieres, puede haber un desfase entre las imágenes del servidor, y las solicitadas en el cliente.

Pruébalo. ¡Suerte!.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar