# Tambah Interaksi Berasaskan Tetikus pada Objek 3D - Spline 101 | Bina Adegan Interaktif Pertama Anda - Spline Academy (https://spline.design/ms/academy/tutorials/add-mouse-based-interactions-to-3d-objects)

> Ketahui cara anda boleh mencipta interaksi dengan mudah dengan menjadikan elemen 3D bertindak balas terhadap kursor anda!

1. [Academy](https://spline.design/ms/academy)
2. [Kursus](https://spline.design/ms/academy/collections)
3. [Spline 101 | Bina Adegan Interaktif Pertama Anda](https://spline.design/ms/academy/collections/spline-101-build-your-first-interactive-scene)
4. Tambah Interaksi Berasaskan Tetikus pada Objek 3D

# Tambah Interaksi Berasaskan Tetikus pada Objek 3D

Pelajaran 4 daripada 16Spline 3DPemula14 min

Ketahui cara anda boleh mencipta interaksi dengan mudah dengan menjadikan elemen 3D bertindak balas terhadap kursor anda!

Panduan ini direka untuk pemula, memastikan pengenalan yang mudah diikuti tentang konsep-konsep ini.

Kami menunjukkan kekuatan peristiwa tetikus dalam meningkatkan reka bentuk 3D, seperti peristiwa mouse up, down, press dan hover. Kami juga menunjukkan cara mencipta pengalaman interaktif dengan memautkan peristiwa tetikus kepada tindakan seperti perubahan warna, saiz dan animasi, serta pergerakan kamera dan banyak lagi!

Lihat tutorial lain ini untuk lebih banyak tentang peristiwa tetikus! <https://youtu.be/pR2AhQ22KwM> <https://youtu.be/eCxLYk2rNzg> <https://youtu.be/hRy-Iqle6EU> <https://youtu.be/RmC2xEtXobE> <https://youtu.be/lJIDSiDlhvw>

\---

Temui lebih ramai pencipta dan projek hebat #MadeInSpline di <https://community.spline.design/>

## Apa yang akan anda pelajari

1. [0:00Pengenalan](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=0s)
2. [0:29Memahami Peristiwa Tetikus](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=29s)
3. [1:42Mencipta Interaksi Mouse Down Ringkas](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=102s)
4. [5:02Tukar warna apabila diklik](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=302s)
5. [6:03Butang interaktif dan pertukaran warna](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=363s)
6. [8:47Interaksi klik dengan perubahan kedudukan kamera](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=527s)
7. [10:54Menambah Kesan Bunyi](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=654s)
8. [12:01Meneroka Tindakan Create Object](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=721s)
9. [12:20Menambah URL untuk membuka laman web apabila diklik.](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=740s)

## Sumber berkaitan

- [Mouse Hover EventTemplat](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 worksDokumen](https://docs.spline.design/interaction-states-events-and-actions/how-state-based-animation-works)
- [Events & InteractivityDokumen](https://docs.spline.design/interaction-states-events-and-actions/events-interactivity)
- [EventsDokumen](https://docs.spline.design/#events)
- [ActionsDokumen](https://docs.spline.design/#actions)

## Gambaran keseluruhan

- Spline 3D
- 14 min
- Pemula

## Seterusnya

[Cara Mencipta Interaksi Butang 3D10 minPemula](https://spline.design/ms/academy/collections/spline-101-build-your-first-interactive-scene/how-to-create-3d-button-interactions)[Teruskan](https://spline.design/ms/academy/collections/spline-101-build-your-first-interactive-scene/how-to-create-3d-button-interactions)

[Spline](https://spline.design/ms)

Editor 3D dan 2D untuk pasukan dan ejen mereka. Terbitkan ke web, iOS dan Android.

#### Tanya AI tentang Spline

#### Produk

- [Reka Bentuk 3D](https://spline.design/ms/3d-design)
- [Hana](https://spline.design/ms/hana)
- [Omma](https://omma.build)
- [Penjanaan 3D AI](https://spline.design/ms/ai-generate)
- [Spline MCP](https://spline.design/ms/mcp)
- [Spline Arena](https://spline.design/ms/arena)
- [Harga](https://spline.design/ms/pricing)
- [Perusahaan](https://spline.design/ms/enterprise)

#### Runtime

- [Web](https://spline.design/ms/web)
- [iOS](https://spline.design/ms/ios)
- [Android](https://spline.design/ms/android)

#### Aplikasi

- [Muat Turun](https://spline.design/ms/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Muat turun Spline Mirror](https://spline.design/download-mirror)

#### Belajar

- [Docs](https://docs.spline.design/)
- [Academy](https://spline.design/ms/academy)
- [API Spline](https://www.npmjs.com/package/@splinetool/runtime)
- [Penyelesaian](https://spline.design/solutions)

#### Komuniti

- [Komuniti Spline](https://community.spline.design)
- [Blog](https://spline.design/ms/blog)
- [Log Perubahan](https://spline.design/ms/changelog)
- [Pendidikan](https://spline.design/ms/education)
- [Contra](https://spline.design/contra)
- [Afiliat](https://spline.design/ms/affiliate)

#### Syarikat

- [Pelanggan](https://spline.design/ms/customers)
- [Kerjaya](https://www.ycombinator.com/companies/spline/jobs)
- [Keselamatan](https://spline.design/ms/security)

#### Undang-undang

- [Terma & Syarat](https://spline.design/terms)
- [Privasi](https://spline.design/privacy)

#### Hubungi

- [help@spline.design](mailto:help@spline.design)
- [jobs@spline.design](mailto:jobs@spline.design)

© 2026 - Spline, Inc.