Kommentar: Wir haben den Schläger mit JQuery initialisiert. Jetzt machen wir ein Experiment darüber, wie Sie JQuery verwenden, um Spielelemente zu platzieren und einen Gitterhintergrund zu verwenden, um den Ort unserer Spielelemente zu überprüfen. Interessierte Freunde können darüber lernen. Ich wünsche Ihnen allen eine glückliche Spielentwicklung
JQuery Einführung[Ich werde diesen Teil nicht lesen, es gibt viele im Internet. Wenn Sie nicht verstehen, suchen Sie bitte ein Baidu -Mädchen.
Verwenden Sie JQuery, um Spielelemente zu bedienen
Wir haben den Schläger mit JQuery initialisiert. Jetzt machen wir ein Experiment darüber, wie Spielelemente mit JQuery platziert werden können.
Verschieben - Verwenden Sie JQuery, um die Position des Elements zu ändern
Verwenden wir einen Gitterhintergrund, um die Elementposition unseres Spiels zu überprüfen:
1. Verwenden wir weiterhin PingPong -Beispiel.
2. Laden Sie das Bild von Grid -Hintergrund herunter, das wir von hier benötigen.
3. Erstellen Sie einen Ordner namens Bilder im Übungsverzeichnis.
4. Platzieren Sie das heruntergeladene Bild in den Ordner Jimages. Dieses Bild hilft uns, die Verschiebung der Pixel später zu überprüfen.
5. Als nächstes öffnen Sie index.html im Herausgeber.
6. Ändern Sie die Hintergrundeigenschaft von Playground Div wie folgt, um Pixel -Gitterbilder einzuschließen.
#Spielplatz{
Hintergrund: #e0ffe0 URL (Bilder/pixel_grid.jpg);
Breite: 400px;
Höhe: 200px;
Position: Relativ;
Überlauf: versteckt;
}
7. Jetzt öffnen index.html im Browser. Was wir sehen sollten, sollte der folgende Screenshot sein: Ein Netz wird im Spielhintergrund abgedeckt, und wir können jetzt den Ort aller Elemente sehen.
was ist passiert?
Für das einfache Debuggen haben wir ein Bild namens Pixel_Grid.jpg auf den Hintergrund gesetzt. Dieses Bild hat viele kleine Netze, jedes 10x10 -Gitter bildet einen großen Teil von 100x100 Pixel. Durch dieses Bild haben wir einen Herrscher, der es uns ermöglicht, die Position von Elementen auf dem Bildschirm zu messen.