สร้างภาพเคลื่อนไหว CSS Cool ได้อย่างง่ายดายด้วย Animista
มี เว็บแอนิเมชั่นภาพเคลื่อนไหว CSS ออนไลน์มากมาย. แต่น้อยมากเมื่อเทียบกับระดับของรายละเอียดและความสะดวกในการใช้งานที่คุณได้รับ Animista.
แอพพลิเคชั่นเว็บฟรีนี้ให้คุณได้ สร้างภาพเคลื่อนไหว CSS ที่กำหนดเองที่คลิกปุ่ม. คุณเลือกระหว่างการเคลื่อนไหวที่ออกแบบไว้ล่วงหน้าเช่นสไลด์การแปลงการแกว่งหรือแม้แต่ภาพเคลื่อนไหวที่ปล่อยเงา.
เมื่อคุณสร้างภาพเคลื่อนไหวของคุณแล้วคุณสามารถ ส่งออกรหัส เหมือนกับ CSS กำเนิดอื่น ๆ ยกเว้นรหัสนี้ง่ายต่อการใช้งานและแม้กระทั่ง มาพร้อมกับเครื่องมือ minifier ในตัว.
อินเทอร์เฟซอาจรู้สึกสับสนในตอนแรก แต่เป็นเพราะคุณมีตัวเลือกจำนวนเท่าใด!
คุณสร้างภาพเคลื่อนไหวที่กำหนดเอง ทำตามสามขั้นตอนหลัก และการใช้อินเตอร์เฟซ จากบนลงล่าง:
- เลือกสไตล์การเคลื่อนไหว (แกว่ง, เลื่อน, พลิก - สเกล) จากวงกลมที่ด้านบน
- ปรับแต่งมันด้วยประเภทการเคลื่อนไหวที่แตกต่างกัน ภายใต้
- แก้ไขตัวเลือกภาพเคลื่อนไหวของคุณ ในแถบตัวเลือกด้านซ้ายลอย
ผ่านขั้นตอนนี้คุณสามารถเปลี่ยนระยะเวลาทั้งหมดของภาพเคลื่อนไหวรูปแบบการผ่อนคลายความล่าช้าและทุกอย่าง และทุกอย่าง ทำงานผ่าน CSS3 บริสุทธิ์, ซึ่งทำให้มันน่าประทับใจยิ่งขึ้น.
นอกจากนี้โปรดสังเกตที่ navbar บนสุดที่คุณสามารถเลือกได้ สไตล์เป้าหมายภาพเคลื่อนไหวชนิดต่าง ๆ.
ค่าเริ่มต้นคือ “ขั้นพื้นฐาน” ซึ่งสามารถทำงานกับสิ่งใด ๆ ที่สวยมาก (โฮเวอร์คลิกหรือภาพเคลื่อนไหวทันที) เป้าหมายอื่น ๆ ได้แก่ ข้อความหน้าภาพเคลื่อนไหวพื้นหลังและภาพเคลื่อนไหวทางเข้าที่กำหนดเอง เพื่อนำองค์ประกอบของหน้าที่ซ่อนอยู่ในมุมมอง.
ฉันชอบโดยเฉพาะอย่างยิ่ง “ความสนใจ” ลิงก์ที่ด้านบนซึ่งมีเอฟเฟกต์การสั่น & การสั่นไหวสุดเจ๋งสำหรับสไตล์ปุ่ม ปุ่มเหล่านี้ใช้งานได้ดีบนปุ่ม CTA เพื่อดึงดูดความสนใจและกระตุ้นการโต้ตอบของผู้ใช้.
เมื่อคุณทำการปรับเปลี่ยนเสร็จแล้วคุณก็แค่ คลิกที่ไอคอนวงเล็บเล็ก ๆ ที่มุมบนขวาของบานหน้าต่างแสดงตัวอย่าง.
นี่จะนำหน้าใหม่เข้ามาดูด้วย คลาสแอนิเมชั่น CSS เต็มของคุณพร้อมกับเฟรมหลัก. คุณสมบัติเสริมช่วยให้คุณ ลดขนาดรหัส และ รวมถึง prefixer อัตโนมัติ ซึ่งรองรับเว็บเบราว์เซอร์รุ่นเก่า.
ฉันใช้เครื่องมือสร้างภาพเคลื่อนไหว CSS ที่กำหนดเองเป็นจำนวนมากและไม่ต้องสงสัยเลยว่า Animista เป็นเครื่องมือที่มีคุณสมบัติครบครันที่สุด มันฟรีโดยสิ้นเชิงและซับซ้อนเล็กน้อยในตอนแรก แต่เมื่อคุณเข้าใจอินเตอร์เฟสมันเป็นเครื่องกำเนิดที่ดีที่สุดที่คุณสามารถใช้ได้.
หากต้องการทดลองใช้เพียงไปที่หน้าแรกและคลิก “ลองฉันสิ”. นอกจากนี้คุณยังสามารถแบ่งปันความคิดและคำชมของคุณกับผู้สร้าง @ ana108 ของเว็บแอป.
