แอนิเมชันบนเว็บไซต์สามารถใช้เพิ่มเอฟเฟกต์ภาพขณะโหลดหน้าเว็บได้ เช่น การค่อยๆ ปรากฏ การค่อยๆ หายไป การย่อขนาด และอื่นๆ ซึ่งจะเพิ่มความน่าสนใจให้กับเว็บไซต์ของคุณเมื่อผู้ใช้เลื่อนหน้าเว็บ
คุณสามารถเลือกรูปแบบแอนิเมชั่นที่แตกต่างกันสำหรับองค์ประกอบต่างๆ ของเว็บไซต์ของคุณได้
ในบทความนี้:
แก้ไขแอนิเมชั่นเว็บไซต์
แอนิเมชันสามารถทำให้เว็บไซต์ดูน่าสนใจยิ่งขึ้นและทำให้องค์ประกอบต่างๆ บนเว็บไซต์มีชีวิตชีวาขึ้น สร้างประสบการณ์ที่ดึงดูดและดื่มด่ำยิ่งขึ้นสำหรับผู้ใช้
- คลิกที่ นิเมชั่น (3) ตัวเลือก
ในส่วนนี้ คุณจะเห็นการตั้งค่าทั้งหมดที่มีให้ใช้งานเพื่อจัดการและปรับแต่งแอนิเมชันสำหรับองค์ประกอบต่างๆ บนเว็บไซต์ของคุณ
- โดยค่าเริ่มต้น เลื่อนขึ้น จะมีการนำแอนิเมชันมาใช้กับเว็บไซต์ทั้งหมด
- เลือก ไม่มี หากคุณต้องการปิดใช้งานแอนิเมชัน
องค์ประกอบต่างๆ ของเว็บไซต์
Pixpa ช่วยให้คุณสามารถใช้แอนิเมชันกับองค์ประกอบต่อไปนี้ในเว็บไซต์ของคุณ:
- รูปภาพ: เพิ่มการเคลื่อนไหวให้กับภาพของคุณเพื่อดึงดูดความสนใจของผู้เข้าชม
- หัวข้อ H1: ใช้ภาพเคลื่อนไหวเพื่อทำให้หัวข้อหลักโดดเด่นยิ่งขึ้น
- หัวข้อ H2: เพิ่มแอนิเมชั่นให้กับหัวข้อย่อยหรือชื่อเรื่องขนาดเล็กเพื่อช่วยให้เนื้อหาไหลลื่นยิ่งขึ้น
- ข้อความ: ทำให้เนื้อหาของคุณมีชีวิตชีวามากขึ้นด้วยการใส่แอนิเมชั่นให้กับย่อหน้าและคำอธิบาย
- ปุ่ม: เพิ่มความโดดเด่นให้กับปุ่มกระตุ้นการดำเนินการของคุณด้วยเอฟเฟกต์ที่สะดุดตา
อย่าลืมกด สาธารณะ (6) ปุ่มเพื่อบันทึกการเปลี่ยนแปลงทั้งหมดและทำให้ใช้งานได้จริงบนเว็บไซต์
สไตล์แอนิเมชั่น
- ค่อยๆ ปรากฏ – ค่อยๆ เผยองค์ประกอบต่างๆ โดยเพิ่มระดับความทึบแสงจากโปร่งใสไปจนถึงทึบแสง
- เลื่อนขึ้น – การเคลื่อนที่อย่างราบรื่นขององค์ประกอบต่างๆ บนหน้าจอจากตำแหน่งที่ต่ำกว่าไปยังตำแหน่งที่สูงกว่า
- ขยายขนาดธุรกิจ – ค่อยๆ เพิ่มขนาดหรือสเกลขององค์ประกอบนั้น
- ลดขนาดลง – ค่อยๆ ลดขนาดหรือสเกลขององค์ประกอบลง
- เปิดเผย - ค่อยๆ เปิดเผยหรือเผยองค์ประกอบต่างๆ บนหน้าจอทีละน้อย
เลือก ไม่มี เพื่อปิดใช้งานแอนิเมชันสำหรับองค์ประกอบนั้นๆ
ภาพเคลื่อนไหวความเร็ว
อัตราการเปลี่ยนสถานะของภาพเคลื่อนไหวจากสถานะหนึ่งไปอีกสถานะหนึ่ง ซึ่งเป็นตัวกำหนดว่าการเปลี่ยนแปลงของภาพเคลื่อนไหวจะเกิดขึ้นบนหน้าจอเร็วหรือช้าเพียงใด
มีตัวเลือกให้เลือก 3 แบบ: ช้า ปานกลาง และ รวดเร็ว
หากคุณใช้เทมเพลตเก่า คุณอาจไม่เห็นตัวเลือกแอนิเมชัน คุณต้องเปลี่ยนเว็บไซต์ไปใช้เทมเพลตใหม่ รู้เพิ่มเติม
ชมตัวอย่างการใช้งานแอนิเมชั่น Slide Up ได้ที่นี่:
