Feste Werte
Lektion 10 von 18 im Kurs Ziehende Wolken – HTML/CSS/JS-Projekt von Coddy.
Lass uns die Cloud bewegen!
Aufgabe
EinfachBevor wir anfangen, die Wolke zu bewegen, lassen Sie uns die Position und Größe der Wolke festlegen.
Kommentieren Sie den Code aus, der der Wolke eine zufällige Position und Größe zuweist.
Zielen Sie in der JS-Datei auf das cloud-Element und:
- Setzen Sie die Style-Eigenschaft
leftauf200px. - Setzen Sie die Style-Eigenschaft
topauf200px. - Setzen Sie die Style-Eigenschaft
transformaufscale(0.5).
Setzen Sie außerdem die Style-Eigenschaft transition auf "all linear 3s", das wird uns später helfen, die Wolke zu animieren!
Probier es selbst
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<!-- Write HTML code here -->
<script src="script.js"></script>
</body>
</html>Alle Lektionen in Ziehende Wolken – HTML/CSS/JS-Projekt
1Einführung
Einführung5Die Wolke bewegen
Feste Werte
Nach rechts bewegenRichtungen abwechselnSofort startenAlles zufällig festlegen