ภาพเคลื่อนไหวบนเว็บเป็นมาตรฐานชุดใหม่ที่รวมภาพเคลื่อนไหว CSS และ JavaScript ไว้ด้วยกัน ด้วยภาพเคลื่อนไหวบนเว็บ คุณจะได้รับพลังในการเคลื่อนไหวบน GPU ในขณะที่ยังคงสามารถควบคุมการทำงานใน JavaScript ได้ แต่การประสานภาพเคลื่อนไหวทั้งหมดนี้ไม่ใช่เรื่องง่าย และโชคดีที่มีองค์ประกอบแบบนั้น จริงๆ แล้วเป็นลักษณะการทำงานที่ดี แต่ควรอยู่กับฉัน!
ในตอนนี้ ผมจะสอนวิธีใช้พฤติกรรมแบบนีออนของภาพเคลื่อนไหวจากแคตตาล็อกขององค์ประกอบ Polymer Element ไปจนถึงการผสมรูปแบบภาพเคลื่อนไหวสุดเจ๋งโดยไม่ต้องจัดการทุกอย่างด้วยตัวเองให้ยุ่งยาก และด้วยความรู้นี้ เราทุกคนก็พร้อมที่จะเรียนรู้เกี่ยวกับองค์ประกอบหน้ากระดาษแบบเคลื่อนไหวอันเป็นเอกลักษณ์ในตอนต่อไป
อ่านเพิ่มเติม
แหล่งที่มาของโปรเจ็กต์
https://github.com/Polymer/polycasts/tree/master/ep23-neon-animation/login-panel
เอกสารภาพเคลื่อนไหวนีออน
https://elements.polymer-project.org/elements/neon-animation?active=neon-animated-pages
คู่มือภาพเคลื่อนไหวนีออน
https://elements.polymer-project.org/guides/using-neon-animations
ไอคอนที่กำหนดเองพร้อมชุดไอคอนเหล็ก -- Polycasts #22
https://www.youtube.com/watch?v=tjmRUgUca1g&list=PLOU2XLYxmsII5c3Mgw6fNYCzaWrsM3sMN&index=2
พฤติกรรม -- Polycasts #21
https://www.youtube.com/watch?v=YrlmieL3Z0k&index=1&list=PLOU2XLYxmsII5c3Mgw6fNYCzaWrsM3sMN
ไอคอนเหล็ก -- Polycasts #20
https://www.youtube.com/watch?v=6kkNgVG6LuI&list=PLOU2XLYxmsII5c3Mgw6fNYCzaWrsM3sMN&index=1
ข้อมูลเพิ่มเติม
- Polymer Slack: http://bit.ly/polymerslack
- ติดตามช่อง Google Developers