Red de conocimiento informático - Material del sitio web - Cómo lograr el efecto de alejar gradualmente la imagen a través de js

Cómo lograr el efecto de alejar gradualmente la imagen a través de js

¡Enn, leí este efecto esperado de ti! Aquí está mi código que puedes ver para lograr este efecto:

AlloyTeanm-zy

cuerpo{

font-family:?simhei;

desbordamiento:?oculto;

}

#div1{

desbordamiento:oculto;

}

#pic{

Posición:?relativa;

desbordamiento:?oculto;

}

$(document).ready(function(){

$("# foto ").load(function()?{

$("#pic").animate({ancho:'1520px',alto:'700px',arriba:'-10px',izquierda: ' -5px',abajo:'0px',derecha:'-10px'},8000);

})

})

< / body>

Algunos puntos a tener en cuenta: 1. Estoy usando jQuery y necesito introducir una biblioteca jQuery externa. 2. ¡El tamaño original de la imagen y el tamaño de la pantalla afectarán este efecto! 3. Estos atributos superiores e izquierdos se ajustan de acuerdo con mis imágenes y pantallas. Debes cambiar los valores específicos de acuerdo con tu propia situación. De todos modos, ¡este es el principio! El principio es que el largo y el ancho de la imagen son mayores que la ventana de la pantalla o DIV, es decir, una mayor parte de la imagen se "desborda", use "overflow:hidden" para ocultarla y luego restaurarla al mismo tamaño que la ventana o DIV, por lo que producirá el efecto de que la imagen se aleja. Si no entiendes algo, ¡puedes preguntarme! ¡Espero que te ayude y espero que lo adoptes!