Ver Mensaje Individual
  #1 (permalink)  
Antiguo 25/07/2014, 07:38
grojaspineda
 
Fecha de Ingreso: julio-2014
Ubicación: San Jose
Mensajes: 5
Antigüedad: 9 años, 10 meses
Puntos: 0
Me tira el scroll hasta el fondo

Hola Compañeros

como estan?
Mi problema esque busque en interner una galeria de imagenes, y encontre una y le hice un par de cambios y la adapte a mi pagina, pero cuando selecciono el boton para que me muestre otra imagen la pantalla me la tira hasta el findo.

este es el codigo.

HTML
Código:
<section id="foto_perfil">
			<div>
			   <div id="images">
					<img id="image1" src="img/1.jpg" />
					<img id="image2" src="img/2.jpg" />
 					<img id="image3" src="img/3.jpg" />
				    <img id="image4" src="img/4.jpg" />
				    <img id="image5" src="img/5.jpg" />
			   </div>
			    <div id="slider">
				    <a href="#image1">1</a>
				    <a href="#image2">2</a>
				    <a href="#image3">3</a>
				    <a href="#image4">4</a>
				    <a href="#image5">5</a>
			    </div>
			</div>

		</section>
Código:
/*Galeria de Imagenes*/
#images{
    width: 500px;
    height: 300px;
    overflow: hidden;
    position: relative;
    margin: 20px auto;
}
#images img {
    width: 500px;
    height: 300px;
    position: relative;
    top: 0;
    z-index: 1;
    opacity: 0;
    transition: all linear 500ms;
    -o-transition: all linear 500ms;
    -moz-transition: all linear 500ms;
    -webkit-transition: all linear 500ms;
}
#images img:first-child {
    left: 0;
    }
#slider{
    width: 200px;
    margin: 0 auto;
}
#slider a {
    text-decoration: none;
    background: #E3F1FA;
    border: 1px solid #C6E4F2;
    padding: 4px 6px;
    color: #222;
    }
#slider a:hover {
    background: #C6E4F2;
}
#images img:target {
    left: 0;
    z-index: 9;
    opacity: 1;
}
gracias