Ver Mensaje Individual
  #1 (permalink)  
Antiguo 17/04/2015, 00:50
Dckings
 
Fecha de Ingreso: abril-2015
Mensajes: 4
Antigüedad: 9 años, 7 meses
Puntos: 0
Como puedo crear un mejor efecto en mi slideshow con JQuery

De antemano gracias por su tiempo y sus respuestas de verdad, bien eh estado estudiando un poco de JQuey y empece a crear un slideshow muy rudimentario , solamente cambia las imágenes pero lo hace de golpe , no hay un intervalo entre cambio y cambio de forma lenta , es decir quiero crear el efecto de que se van las imágenes hacia la izquierda pero de forma lenta, la verdad no se que métodos usar aun soy algo novato en esto, así que mi pregunta es : COMO PUEDO LOGRAR ESE EFECTO DE TRANSICIÓN A LA IZQUIERDA PERO DE FORMA LENTA EN MI SLIDESHOW?

aqui mi codigo de lo que llevo echo :

Código:
<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>Slider JQ</title>
		<style>
			#contenedor img{
				width: 660px;
				height:400px;
			}

			#contenedor{
				height: 400px;
				width:660px;
				margin:0 auto;
				overflow: hidden;
				border:groove 10px #000;
			}

			#botonera{
				text-align: center;
				width:150px;
				height:40px; 
				margin:10px auto;
			}
		</style>
		<script src="JQuery.js"></script>
		<script>

			$(document).on('ready',function  () {
				
				$('#adelante').on('click',function(){
					$('#contenedor img:first').appendTo('#contenedor');
				})

				$('#atras').on('click',function(){
					$('#contenedor img:last').prependTo('#contenedor:first');
				})
			})
		</script>
	</head>
	<body>
		<div id="contenedor">
			<img src="IMG1.jpg" alt="">
			<img src="IMG2.png" alt="">
			<img src="IMG3.jpg" alt="">
		</div>
		<div id="botonera">
			<button id="atras">Previus</button>
			<button id="adelante">Next</button>
			<!--<button></button>-->
		</div>
	</body>
</html>