Terminado

Galería de imágenes simple con Jquery

Publicado el 29 Agosto, 2013 en Programación y Tecnología

Sobre este proyecto

Abierto

Crear una galeria de fotos simple en base a la estructura html que tengo, es muy simple, tengo varias imagenes detro de un html y sobre la foto que se muestra tengo dos botones (encima de la foto) uno es para click siguiente otro para atras y tiene que funcionar de esa manera, al dar click en siguiente llevara a la foto que sigue y de la misma fotrma al dar click para atras que se muestre la foto anterior, necesito que sea geneérica, es decir voy a ocupar la misma funcion en varios paginas de ese sitio, pueden ser desde 5 hasta 100 fotos sin importar nombre, tengo la siguiente estructura en mi html:

<div id="content">
                <div id="img1" class="imagen">
                    <img class="fashion" src="img/photo-1.jpg" alt="">
                    <a class="previous anterior" title="Previous image" href="#"></a>
                    <a class="next segunda" title="Next image" href="#"></a>
                </div>
                <div id="img2" class="imagen">
                    <img class="editorial" src="img/photo-2.jpg" alt="">
                    <a title="Previous image" href="#"></a>
                    <a title="Next image" href="#"></a>
                </div>
                <div id="img3" class="imagen">
                    <img class="film" src="img/photo-3.jpg" alt="">
                    <a title="Previous image" href="#"></a>
                    <a title="Next image" href="#"></a>
                </div>
                <div id="img4" class="imagen">
                    <img class="example" src="img/photo-4.jpg" alt="">
                    <a class="previous" title="Previous image" href="#"></a>
                    <a class="next" title="Next image" href="#"></a>
                </div>
               
                <div id="instructions">
                    <p>Click on Image</p>
                </div>
        </div><!--#content-->


Necesito que al dar click en el link con titulo "Next Image"  oculte la imagen actual y muestre la siguiente "img" dentro del div con clase "imagen" y al dar click en "Previous Image" oculte la actual y muestre la "img" que esta dentro del div anterior con clase "imagen" espero me explique bien, de todas formas anexo el proyecto para que lo revisen

jQuery

Categoría Programación y Tecnología

Plazo de Entrega: No definido

Habilidades necesarias

Otros proyectos publicados por C. G.