Comentario: Hemos inicializado la raqueta con jQuery. Ahora estamos haciendo un experimento sobre cómo usar jQuery para colocar elementos del juego y usar antecedentes de cuadrícula para verificar la ubicación de nuestros elementos del juego. Los amigos interesados pueden aprender al respecto. Les deseo a todos un juego de juego feliz
Introducción de jQuery[No leeré esta parte, hay muchos en Internet. Si no lo entiendes, busca una chica de Baidu]
Use jQuery para operar elementos del juego
Hemos inicializado la raqueta con jQuery. Ahora hacemos un experimento sobre cómo colocar elementos del juego usando jQuery.
Mover: use jQuery para modificar la posición del elemento
Usemos un fondo de cuadrícula para verificar la posición del elemento de nuestro juego:
1. Sigamos usando el ejemplo de Pingpong.
2. Descargue la imagen de fondo de la cuadrícula que necesitamos desde aquí.
3. Cree una carpeta con nombre de imágenes en el directorio de ejercicios.
4. Coloque la imagen descargada en la carpeta Jimages. Esta imagen nos ayudará a verificar el desplazamiento de los píxeles más adelante.
5. A continuación, abra index.html en el editor.
6. Modifique la propiedad de fondo de Playground Div de la siguiente manera para incluir imágenes de cuadrícula de píxeles.
#patio de juegos{
fondo: #e0ffe0 url (imágenes/pixel_grid.jpg);
Ancho: 400px;
Altura: 200px;
Posición: relativo;
desbordamiento: oculto;
}
7. Ahora abra index.html en el navegador. Lo que deberíamos ver debería ser la siguiente captura de pantalla: una cuadrícula está cubierta en el fondo del juego, y ahora podemos ver la ubicación de todos los elementos.
¿qué pasó?
Para facilitar la depuración, colocamos una imagen llamada pixel_grid.jpg en el fondo. Esta imagen tiene muchas cuadrículas pequeñas, cada cuadrícula de 10x10 forma una gran parte de 100x100 píxeles. A través de esta imagen, tenemos una regla que nos permite medir la posición de los elementos en la pantalla.