บทความนี้ส่วนใหญ่แนะนำการสอนเกี่ยวกับการใช้ผ้าใบใน HTML5 เพื่อวาดการเคลื่อนไหวของอนุภาคด้วยสูตรและต้องใช้รหัส JavaScript เป็นสูตร เพื่อนที่ต้องการมันสามารถอ้างถึงมันได้
เมื่อเร็ว ๆ นี้ฉันต้องการสร้างหน้าเว็บและวางการสาธิตบางอย่างที่ฉันทำในกระบวนการเรียนรู้ HTML5 เพื่อสร้างคอลเลกชัน อย่างไรก็ตามถ้าฉันเพิ่งสร้างหน้าเว็บและจัดเรียงการสาธิตทั้งหมดทีละคนมันจะรู้สึกน่าเกลียดเกินไป ฉันแค่คิดว่าเนื่องจากฉันได้เรียนรู้ผืนผ้าใบมายุ่งกับเบราว์เซอร์และสร้างแอนิเมชั่นเปิดเล็ก ๆ
ฉันคิดถึงเอฟเฟกต์ของแอนิเมชั่นเปิดอยู่พักหนึ่งและตัดสินใจใช้อนุภาคเพราะฉันคิดว่าอนุภาคสนุกมากขึ้น ฉันยังจำโพสต์บล็อกทางเทคนิคครั้งแรกที่ฉันเขียนไว้ก่อนหน้านี้ซึ่งเกี่ยวกับภาพข้อความคล้ายอนุภาค: ภาพข้อความคล้ายอนุภาคและจากนั้นฉันก็มีการเคลื่อนไหวเชิงเส้นเท่านั้นและเพิ่มเอฟเฟกต์ 3 มิติเล็กน้อย สูตรการเคลื่อนไหวนั้นง่าย ดังนั้นฉันแค่ต้องการทำให้แอนิเมชั่นเปิดนี้ไดนามิกมากขึ้น
ไปสาธิตก่อน: http://2.axescanvas.sinaapp.com/demohome/index.html
เอฟเฟกต์ไดนามิกมากกว่าการเคลื่อนไหวของเส้นตรงหรือไม่? และมันก็ง่ายมาก อย่าลืมชื่อของโพสต์บล็อกนี้สูตรเล็ก ๆ และความสนุกที่ยอดเยี่ยม เพื่อให้บรรลุผลดังกล่าวเราใช้โรงเรียนมัธยมต้นเท่านั้น - หรือความรู้ทางฟิสิกส์ในโรงเรียนมัธยมสูตรสำหรับการเร่งการเคลื่อนไหวและการเคลื่อนไหวที่ชะลอตัวลง ดังนั้นมันจึงเป็นสูตรเล็ก ๆ โปสเตอร์ชอบยุ่งกับสิ่งดีๆ แม้ว่ามันอาจจะไม่เป็นประโยชน์ในการทำงาน แต่ความสนุกนี้น่าสนใจจริงๆ นอกจากนี้การทำสิ่งเหล่านี้ยังสามารถเพิ่มความสามารถในการคิดการเขียนโปรแกรมของคุณ
โดยไม่ต้องกังวลใจฉันจะไปที่หัวข้อ เพียงแค่อธิบายหลักการสั้น ๆ ~~~
รหัสหลักของการเคลื่อนที่ของอนุภาคเป็นเพียงสิ่งนี้:
XML/HTML รหัสคัดลอกเนื้อหาไปยังคลิปบอร์ด