قيم ثابتة

الدرس 10 من 18 في دورة سحب متحركة - مشروع HTML/CSS/JS على Coddy.

لنحرك السحابة!

التحدي

سهل

قبل أن نبدأ في تحريك السحابة، دعنا نثبت موضع وحجم السحابة.

قم بتحويل الكود الذي يحدد موضعاً وحجماً عشوائياً للسحابة إلى تعليق (Comment).

في ملف JS، استهدف عنصر السحابة و:

قم بتعيين خاصية النمط left إلى 200px.
قم بتعيين خاصية النمط top إلى 200px.
قم بتعيين خاصية النمط transform إلى scale(0.5).

أيضاً، قم بتعيين خاصية النمط transition إلى "all linear 3s"، سيساعدنا ذلك في تحريك السحابة لاحقاً!

جرّب بنفسك

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="styles.css">
</head>
    <body>
        <!-- Write HTML code here -->
        <script src="script.js"></script>
    </body>
</html>

جميع دروس سحب متحركة - مشروع HTML/CSS/JS

1مقدمة

4اللعب بـ JS

2الحاوية

5تحريك السحابة

قيم ثابتة

3السحابة

6سحب كثيرة