Idea:
1. Obtenga la distancia del objeto desde la parte superior e izquierda;
2. Obtenga el objeto elemento;
3. Obtenga la distancia de desplazamiento de la barra de desplazamiento cuando se desplaza la barra de desplazamiento;
4. La función se ejecuta cuando la barra de desplazamiento se desplaza: la distancia del objeto desde arriba/izquierda se convierte en la distancia original desde arriba/izquierda + el número de píxeles desplazados por la barra de desplazamiento.
código html:
<!DOCTYPE html>
<html>
<cabeza>
<meta juego de caracteres="UTF-8">
<título></título>
</cabeza>
<cuerpo>
<div id="izquierda">
<img src="images/z1.jpg" alt=""/>
</div>
<div id="derecho">
<img src="images/z2.jpg" alt=""/>
</div>
</cuerpo>
</html> código css:
*{
margen: 0;
relleno: 0;
}
cuerpo{
ancho: 2000px;
altura: 2000 px;
}
.izquierda{
posición: absoluta;
ancho: 110px;
altura: 110 píxeles;
arriba: 100px;
izquierda: 50px;
}
.bien{
posición: absoluta;
ancho: 110px;
altura: 110 píxeles;
arriba: 100px;
izquierda: 1360px;
} código js:
var leftT;//La distancia entre la p izquierda y la superior var leftL;//La distancia entre la p izquierda y la izquierda var rightT;//La distancia entre la p derecha y la var derechaL superior;/ /La distancia entre la p derecha y la izquierda var objLeft;//P objeto de documento a la izquierda var objRight;//P objeto de documento a la derecha function place(){
objLeft=document.getElementById("izquierda");
objRight=document.getElementById("derecho");
leftT=document.defaultView.getComputedStyle(objLeft,null).top;
leftL=document.defaultView.getComputedStyle(objLeft,null).left;
rightT=document.defaultView.getComputedStyle(objRight,null).top;
rightL=document.defaultView.getComputedStyle(objRight,null).left;
}
//Obtiene el número de píxeles desplazados por la función de la barra de desplazamiento move(){
var scrollT=document.documentElement.scrollTop;
var scrollL=document.documentElement.scrollLeft;
//Establece los píxeles desde la p izquierda hasta la parte superior objLeft.style.top=parseInt(leftT)+scrollT+"px";
objLeft.style.left=parseInt(leftL)+scrollL+"px";
objRight.style.top=parseInt(rightT)+scrollT+"px";
objRight.style.left=parseInt(rightL)+scrollL+"px";
}
ventana.onload=lugar;
window.onscroll=move; Recomendaciones relacionadas: [tutorial en vídeo de JavaScript]
¡Lo anterior es usar js para fijar la imagen en una determinada posición de la pantalla! Para obtener más detalles, preste atención a otros artículos relacionados en el sitio web chino de php.
