# Thêm tương tác bằng chuột cho đối tượng 3D - Spline 101 | Xây dựng cảnh tương tác đầu tiên của bạn - Spline Academy (https://spline.design/vi/academy/tutorials/add-mouse-based-interactions-to-3d-objects)

> Học cách dễ dàng tạo tương tác bằng cách khiến các thành phần 3D phản hồi theo con trỏ của bạn!

1. [Academy](https://spline.design/vi/academy)
2. [Khóa học](https://spline.design/vi/academy/collections)
3. [Spline 101 | Xây dựng cảnh tương tác đầu tiên của bạn](https://spline.design/vi/academy/collections/spline-101-build-your-first-interactive-scene)
4. Thêm tương tác bằng chuột cho đối tượng 3D

# Thêm tương tác bằng chuột cho đối tượng 3D

Bài 4 / 16Spline 3DCơ bản14 phút

Học cách dễ dàng tạo tương tác bằng cách khiến các thành phần 3D phản hồi theo con trỏ của bạn!

Hướng dẫn này được thiết kế cho người mới bắt đầu, đảm bảo phần giới thiệu các khái niệm này dễ theo dõi.

Chúng tôi trình diễn sức mạnh của các sự kiện chuột trong việc nâng tầm thiết kế 3D, như các sự kiện mouse up, down, press và hover. Chúng tôi cũng chỉ cách tạo trải nghiệm tương tác bằng cách liên kết sự kiện chuột với các hành động như thay đổi màu sắc, kích thước và hoạt ảnh, cũng như chuyển động camera và nhiều hơn nữa!

Xem thêm các hướng dẫn khác về sự kiện chuột! <https://youtu.be/pR2AhQ22KwM> <https://youtu.be/eCxLYk2rNzg> <https://youtu.be/hRy-Iqle6EU> <https://youtu.be/RmC2xEtXobE> <https://youtu.be/lJIDSiDlhvw>

\---

Khám phá thêm nhiều nhà sáng tạo và dự án tuyệt vời #MadeInSpline tại <https://community.spline.design/>

## Bạn sẽ học được gì

1. [0:00Giới thiệu](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=0s)
2. [0:29Hiểu về sự kiện chuột](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=29s)
3. [1:42Tạo tương tác Mouse Down đơn giản](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=102s)
4. [5:02Đổi màu khi nhấp](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=302s)
5. [6:03Nút tương tác và đổi màu](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=363s)
6. [8:47Tương tác nhấp kèm thay đổi vị trí camera](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=527s)
7. [10:54Thêm hiệu ứng âm thanh](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=654s)
8. [12:01Khám phá hành động Create Object](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=721s)
9. [12:20Thêm URL để mở website khi nhấp.](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=740s)

## Tài nguyên liên quan

- [Mouse Hover EventMẫu](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 worksTài liệu](https://docs.spline.design/interaction-states-events-and-actions/how-state-based-animation-works)
- [Events & InteractivityTài liệu](https://docs.spline.design/interaction-states-events-and-actions/events-interactivity)
- [EventsTài liệu](https://docs.spline.design/#events)
- [ActionsTài liệu](https://docs.spline.design/#actions)

## Tổng quan

- Spline 3D
- 14 phút
- Cơ bản

## Tiếp theo

[Cách tạo tương tác cho nút bấm 3D10 phútCơ bản](https://spline.design/vi/academy/collections/spline-101-build-your-first-interactive-scene/how-to-create-3d-button-interactions)[Tiếp tục](https://spline.design/vi/academy/collections/spline-101-build-your-first-interactive-scene/how-to-create-3d-button-interactions)

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

Trình chỉnh sửa 3D và 2D cho các nhóm và tác nhân AI của họ. Xuất bản lên web, iOS và Android.

#### Hỏi AI về Spline

#### Sản phẩm

- [Thiết kế 3D](https://spline.design/vi/3d-design)
- [Hana](https://spline.design/vi/hana)
- [Omma](https://omma.build)
- [Tạo 3D bằng AI](https://spline.design/vi/ai-generate)
- [Spline MCP](https://spline.design/vi/mcp)
- [Spline Arena](https://spline.design/vi/arena)
- [Bảng giá](https://spline.design/vi/pricing)
- [Doanh nghiệp](https://spline.design/vi/enterprise)

#### Runtime

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

#### Ứng dụng

- [Tải xuống](https://spline.design/vi/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Tải Spline Mirror](https://spline.design/download-mirror)

#### Học

- [Docs](https://docs.spline.design/)
- [Academy](https://spline.design/vi/academy)
- [Spline API](https://www.npmjs.com/package/@splinetool/runtime)
- [Giải pháp](https://spline.design/solutions)

#### Cộng đồng

- [Cộng đồng Spline](https://community.spline.design)
- [Blog](https://spline.design/vi/blog)
- [Changelog](https://spline.design/vi/changelog)
- [Giáo dục](https://spline.design/vi/education)
- [Contra](https://spline.design/contra)
- [Tiếp thị liên kết](https://spline.design/vi/affiliate)

#### Công ty

- [Khách hàng](https://spline.design/vi/customers)
- [Tuyển dụng](https://www.ycombinator.com/companies/spline/jobs)
- [Bảo mật](https://spline.design/vi/security)

#### Pháp lý

- [Điều khoản & Điều kiện](https://spline.design/terms)
- [Quyền riêng tư](https://spline.design/privacy)

#### Liên hệ

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

© 2026 - Spline, Inc.
