שאלה בjs

[#1]

אני עושה את המשחק 2048 ואני רוצה לתת את האפקט של התזוזה(שיראו שהדיב זז מלמטה למעלה לדוג')
יש לי דיב עם ערך בתוךאחד הדיבים של לוח המשחק אני צריכה להזיז את הדיב עם הערך(אנימציה)
ניסיתי כל דרך שאני יודעת אבל ללא הצלחה אשמח אם מישהו יעזור לי

 

[נתנאלה]

CSS Animations

W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.

www.w3schools.com

 

[#1]

הבעיה שלי היא לא לעשות אנימציה....
השאלה אם זה שאני רוצה להזיז דיב שהוא בתוך דיב אחר זה בעייתי
ואיך אפשר לעשות את זה

 

[שירה 123]

הבעיה שלי היא לא לעשות אנימציה....
השאלה אם זה שאני רוצה להזיז דיב שהוא בתוך דיב אחר זה בעייתי
ואיך אפשר לעשות את זה

לא מזיזה- יוצרת דיב חדש ומסתירה את הקודם.

 

[גזעי]

לשאול איך לתכנת משהו שיש יותר מדרך אחת לתכנת אותו גורר תגובות של דעה אישית,
את יכולה להזיז את ה-div עם position: absolute (בJQUERY אתה יכול להשתמש ב-ANIMATE בשביל ליצור את האנימציה).
יש גם מערכות גרידים יפות קיימות בCSS.

 

[java]

יותר הגיוני להזיז מליצור חדש ולהסתיר את הקודם.

 

[שירה 123]

יותר הגיוני להזיז מליצור חדש ולהסתיר את הקודם.

צודקת.
ס'תכלי מתי כתבתי את זה..

 

[#1]

תודה לכל העונות ממש עזרתם
עכשיו יש בעיה חדשה עד שהאנימציה זזה הקוד ממשיך הלאה וזה ממש בעיתי
האם יש דרך לעצור את בריצה לכמה שניות ואז להמשיך שוב?
לא setTimeOut- כי אני לא רוצה לעשות כלום תוך כדי(ניסיתי וזה עושה בעיות כי האנימציה והעצירה הם בתוך לולאה ובינתיים היא ממשיכה הלאה ונתקעת....)

 

[this my name]

אפשר לנסות setInterval
https://www.w3schools.com/js/js_timing.asp

 

[#1]

אפשר לנסות setInterval
https://www.w3schools.com/js/js_timing.asp

מה עוזר לי setInterval אני לא רוצה שזה יחזור על עצמו
וחוץ מזה שתוך כדי הזימון שוב ושוב הוא ממשיך להריץ את הקוד-ואת זה אני רוצה למנוע

 

[נסיון9876]

את לכאורה צריכה איזשהו PROMISE
או ASYNC/AWAIT

 

[#1]

את לכאורה צריכה איזשהו PROMISE
או ASYNC/AWAIT

זה js?

 

[שירה 123]

זה js?

כן.
יש פה הסברים

async function - JavaScript | MDN

The async function declaration creates a binding of a new async function to a given name. The await keyword is permitted within the function body, enabling asynchronous, promise-based behavior to be written in a cleaner style and avoiding the need to explicitly configure promise chains.

developer.mozilla.org

How to use promises - Learn web development | MDN

Promises are the foundation of asynchronous programming in modern JavaScript. A promise is an object returned by an asynchronous function, which represents the current state of the operation. At the time the promise is returned to the caller, the operation often isn't finished, but the promise...

developer.mozilla.org

 

[נתנאלה]

ליצור ארוע כאשר האנימציה מפסיקה, ואז להחיל את ההמשך:

animationend Event

W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.

www.w3schools.com

 

[שלי]

יש לי קטע קוד שלא עובד...
אני רוצה שבעת לחיצה על הכפתור תופיע לי תמונה
אשמח אם מישהו ימצא לי שגיאה בקוד

css:
   #cut{
            display:none;
        }
        
html:
    <img id="cut" src="040103animals_catnroll_prv.gif" />
    <button onclick="func1()">חתול</button>
    
js:
function func1() {
    document.getElementById("myDIV").style.display="block";
}

 

[היימישע מארגג']

document.getElementById("myDIV").style.display="block";
שימי לב שקראת לID של התמונה "cut"...

 

[למדן וידען]

יש לי קטע קוד שלא עובד...
אני רוצה שבעת לחיצה על הכפתור תופיע לי תמונה
אשמח אם מישהו ימצא לי שגיאה בקוד

css:
   #cut{
            display:none;
        }
      
html:
    <img id="cut" src="040103animals_catnroll_prv.gif" />
    <button onclick="func1()">חתול</button>
  
js:
function func1() {
    document.getElementById("myDIV").style.display="block";
}

document.getElementById("myDIV").style.display="block";
שימי לב שקראת לID של התמונה "cut"...

בדיוק
תחליפו את myDIV לcut

 

[אנונימי123]

היי,
תנסי במקום
"myDIV"
לכתוב
"cut"

נראלי זה הבעיה...
בהצלחה

 

[שלי]

וואי ואני שוברת את הראש למה שורה כל כך פשוטה לא עובדת....
תודה רבה!