# เพิ่มการโต้ตอบด้วยเมาส์ให้วัตถุ 3D - Spline Academy (https://spline.design/th/academy/tutorials/add-mouse-based-interactions-to-3d-objects) > เรียนรู้วิธีสร้างการโต้ตอบได้ง่าย ๆ ด้วยการทำให้องค์ประกอบ 3D ตอบสนองต่อเคอร์เซอร์! 1. [Academy](https://spline.design/th/academy) 2. [บทเรียน](https://spline.design/th/academy/tutorials) 3. เพิ่มการโต้ตอบด้วยเมาส์ให้วัตถุ 3D # เพิ่มการโต้ตอบด้วยเมาส์ให้วัตถุ 3D Spline 3Dระดับเริ่มต้น14 นาที เรียนรู้วิธีสร้างการโต้ตอบได้ง่าย ๆ ด้วยการทำให้องค์ประกอบ 3D ตอบสนองต่อเคอร์เซอร์! คู่มือนี้ออกแบบมาสำหรับมือใหม่ เพื่อให้เข้าใจแนวคิดเหล่านี้ได้ง่าย เราจะสาธิตพลังของอีเวนต์เมาส์ในการยกระดับงานออกแบบ 3D เช่น อีเวนต์ mouse up, down, press และ hover เรายังจะแสดงวิธีสร้างประสบการณ์อินเทอร์แอคทีฟด้วยการเชื่อมอีเวนต์เมาส์กับแอ็กชันอย่างการเปลี่ยนสี ขนาด และแอนิเมชัน รวมถึงการเคลื่อนกล้องและอื่น ๆ! ดูบทเรียนอื่น ๆ เหล่านี้เพื่อเรียนรู้เพิ่มเติมเกี่ยวกับอีเวนต์เมาส์! \--- ค้นพบครีเอเตอร์และโปรเจกต์สุดเจ๋งอีกมากมาย #MadeInSpline ได้ที่ ## สิ่งที่คุณจะได้เรียนรู้ 1. [0:00บทนำ](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=0s) 2. [0:29ทำความเข้าใจอีเวนต์เมาส์](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=29s) 3. [1:42สร้างการโต้ตอบ Mouse Down แบบง่าย](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=102s) 4. [5:02เปลี่ยนสีเมื่อคลิก](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=302s) 5. [6:03ปุ่มอินเทอร์แอคทีฟและการเปลี่ยนสี](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=363s) 6. [8:47การโต้ตอบด้วยการคลิกพร้อมเปลี่ยนตำแหน่งกล้อง](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=527s) 7. [10:54เพิ่มเอฟเฟกต์เสียง](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=654s) 8. [12:01สำรวจแอ็กชัน Create Object](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=721s) 9. [12:20เพิ่ม URL เพื่อเปิดเว็บไซต์เมื่อคลิก](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=740s) ## แหล่งข้อมูลที่เกี่ยวข้อง - [Mouse Hover Eventเทมเพลต](https://app.spline.design/academy/tutorials/add-mouse-based-interactions-to-3d-objects?redirect-duplicate-template-uuid=267cdcd9-2272-426a-9b67-4028d2c1d024&is-2d-file=false) - [How state-based animation worksเอกสาร](https://docs.spline.design/interaction-states-events-and-actions/how-state-based-animation-works) - [Events & Interactivityเอกสาร](https://docs.spline.design/interaction-states-events-and-actions/events-interactivity) - [Eventsเอกสาร](https://docs.spline.design/#events) - [Actionsเอกสาร](https://docs.spline.design/#actions) ## ภาพรวม - Spline 3D - 14 นาที - ระดับเริ่มต้น ## ส่วนหนึ่งของ - [Spline 101 | สร้างฉากอินเทอร์แอคทีฟแรกของคุณ](https://spline.design/th/academy/collections/spline-101-build-your-first-interactive-scene/add-mouse-based-interactions-to-3d-objects) ## บทเรียนที่เกี่ยวข้อง [บทเรียนทั้งหมด](https://spline.design/th/academy/tutorials) [สร้างงานออกแบบอินเทอร์แอคทีฟที่ตอบสนองต่อเมาส์ด้วย HanaHanaระดับเริ่มต้น6 นาที](https://spline.design/th/academy/tutorials/create-interactive-designs-that-react-to-your-mouse-with-hana)[วิธีสร้างลูกแก้ว 3D ที่ตอบสนองด้วยการเคลื่อนไหวและการโต้ตอบSpline 3Dระดับกลาง7 นาที](https://spline.design/th/academy/tutorials/how-to-build-a-reactive-3d-orb-with-motion-and-interaction)[วิธีสร้างภาพข้อมูล 3D ใน Spline ด้วยตัวแปรและ API แบบเรียลไทม์Spline 3Dระดับสูง15 นาที](https://spline.design/th/academy/tutorials/how-to-create-3d-data-visualizations-in-spline-using-variables-and-real-time-apis) [Spline](https://spline.design/th) เอดิเตอร์ 3D และ 2D สำหรับทีมและเอเจนต์ของทีม เผยแพร่ได้ทั้งบนเว็บ iOS และ Android #### ถาม AI เกี่ยวกับ Spline #### ผลิตภัณฑ์ - [ออกแบบ 3D](https://spline.design/th/3d-design) - [Hana](https://spline.design/th/hana) - [Omma](https://omma.build) - [สร้าง 3D ด้วย AI](https://spline.design/th/ai-generate) - [Spline MCP](https://spline.design/th/mcp) - [Spline Arena](https://spline.design/th/arena) - [ราคา](https://spline.design/th/pricing) - [องค์กร](https://spline.design/th/enterprise) #### รันไทม์ - [Web](https://spline.design/th/web) - [iOS](https://spline.design/th/ios) - [Android](https://spline.design/th/android) #### แอป - [ดาวน์โหลด](https://spline.design/th/download) - [Spline Mirror](https://spline.design/spline-mirror) - [ดาวน์โหลด Spline Mirror](https://spline.design/download-mirror) #### เรียนรู้ - [Docs](https://docs.spline.design/) - [Academy](https://spline.design/th/academy) - [Spline API](https://www.npmjs.com/package/@splinetool/runtime) - [โซลูชัน](https://spline.design/solutions) #### คอมมูนิตี้ - [คอมมูนิตี้ Spline](https://community.spline.design) - [Blog](https://spline.design/th/blog) - [มีอะไรใหม่](https://spline.design/th/changelog) - [การศึกษา](https://spline.design/th/education) - [Contra](https://spline.design/contra) - [พันธมิตร](https://spline.design/th/affiliate) #### บริษัท - [ลูกค้า](https://spline.design/th/customers) - [ร่วมงานกับเรา](https://www.ycombinator.com/companies/spline/jobs) - [ความปลอดภัย](https://spline.design/th/security) #### กฎหมาย - [ข้อกำหนดและเงื่อนไข](https://spline.design/terms) - [ความเป็นส่วนตัว](https://spline.design/privacy) #### ติดต่อ - [help@spline.design](mailto:help@spline.design) - [jobs@spline.design](mailto:jobs@spline.design) © 2026 - Spline, Inc.