entre Desarrolladores

Recibe ayuda de expertos

Registrate y pregunta

Es gratis y fácil

Recibe respuestas

Respuestas, votos y comentarios

Vota y selecciona respuestas

Recibe puntos, vota y da la solución

Pregunta

2votos

esta es la función que estoy utilizando, pero no se como hacer para que se mueva tan rapido la imagen y el ciclo se a infinito para al afectar el background-position se vea como un vídeo:

$(document).ready(function() {
$('.imagen').mouseenter(function(){
    var numero = -535;
    var suma;
    for (var i = 1; i <= 10; i++) {
        $(this).css({'backgroundPosition': suma+"px 0px"}, "-10");
        suma = numero * i;
    }
});
});

http://jsfiddle.net/kiokotzu/zw8rB/4/

-1voto

perrillo comentado

Has probado ha hacerlo con CSS?

0voto

kiokotzu comentado

seria un poco tedioso hacerlo con css

4 Respuestas

2votos

Elimina el for y coloca esto:

 $(this).animate({'background-position-x': '10px', 'background-position-y': '0'},1000);

0voto

kiokotzu comentado

hola gracias si me sirve, pero es que el ciclo lo coloque para que recorra toda la imagen y parezca un vídeo, me podrías brindar una solucion para ello te lo agradeceria mucho

2votos

camador Puntos240

Hola Esteban, lo que en realidad necesitas es repetir el proceso N veces, esto se logra con setInterval() metes tu código en una función y se ejecuta sin parar, he hecho un ejemplo de lo que necesitas, lo probé y funciona tal como si fuera video.

http://jsfiddle.net/P5Cme/3/

No entiendo porque no funciona en jsfiddle, pero de que funciona, funciona !

0voto

kiokotzu comentado

hola cristian estoy implementado tu código pero tan poco me sirve en el servidor local

1voto

camador comentado

Aquí puedes descargar el código que implemente , verás que corre perfecto:
http://dl.dropboxusercontent.com/u/33900504/prueba-video.html

Si no te corre de forma local puede ser que tu navegador esté bloqueando scripts, utiliza firebug o el inspector de google chrome para revisar porqué no te esta corriendoc omo debe de ser.

Saludos !

1voto

kiokotzu comentado

vale cristian muchas gracias ya me funciona
solo había logrado hacer esto
http://cdpn.io/rLJoe
muchas gracias de nuevo hermano

1voto

lvillasante Puntos1940

Yo recomendaria hacerlo con HTML5, colocandole directamente un video de fondo. He aqui un articulo relacionado http://bit.ly/17fS1p6

1voto

ekipho Puntos160

Ojalá que estás url´s te ayuden... le dan una nueva perspectiva:
http://www.seanmccambridge.com/tubular/
http://tympanus.net/Tutorials/BigVideoSlideshow/

Por favor, accede o regístrate para responder a esta pregunta.

Otras Preguntas y Respuestas


Actividad Reciente

...

Bienvenido a entre Desarrolladores, donde puedes realizar preguntas y recibir respuestas de otros miembros de la comunidad.

Conecta