Trên Internet đã tồn tại nhiều phiên bản của trò chơi rắn săn mồi được viết với ngôn ngữ JavaScript. Nên trò chơi này cũng chỉ là một bài luyện tập của tác giả với ngôn ngữ JavaScript. Tác giả đã dùng thư viện YUI 2 để xử lí các sự kiện JavaScript và DOM.

Bên trên là vài thông tin giới của tác giả trò chơi, còn bây giờ, jsB@nk mời bạn tham gia trò chơi rắn săn mồi này; hãy dùng các phím mũi tên để di chuyển và nhấn phím P để tạm dừng hoặc tiếp tục.

Các hiệu ứng trò chơi rắn săn mồi bằng JavaScript từng được giới thiệu trên jsB@nk:
- Rắn săn mồi
- JavaScript Rắn săn mồi

Hôm nay trong bài viết này, jsB@nk hân hạnh giới thiệu đến bạn một đoạn mã JavaScript tạo trình diễn cực kì độc đáo chỉ với 2 dòng mã lệnh JavaScript, do hiệu ứng trình diễn này được thực hiện dựa trên nền tảng jQuery. Một đoạn mã JavaScript cực kì đơn giản để cài đặt nhưng hiệu ứng hoạt hóa của nó thì rất tuyệt để dùng trên các trang web của bạn. Hãy vào trang trong để xem chi tiết.

Một đoạn mã JavaScript cực kỳ độc đáo để ra hiệu ứng trình đơn y chang các nội dung Flash: người dùng chỉ cần di chuyển con trỏ chuột đến các cạnh của khung thì nội dung tự động trượt sang.

Bạn vui lòng vào trang ví dụ mẫu trực tiếp để thưởng thức hiệu ứng rất tuyệt vời này cùng với các hướng dẫn cài đặt chi tiết.

Khi người dùng nhấn vào nút chỉ định, hiệu ứng JavaScript này sẽ thực hiện việc lấy mã màu của các đối tượng có trên trang web đã được gán trước trước đó và hiển thị ra trên các ô màu hình chữ nhật. Ý tưởng của tác giả khi xây dựng đoạn mã JavaScript này là cung cấp cho người dùng mã màu mà không cần phải xem chi tiết mã nguồn trang web.

Thử thêm các hiệu ứng JavaScript khác trên jsB@nk để lấy mã màu nếu bạn đang có nhu cầu này:

- JavaScript công cụ chọn màu
- JavaScript công cụ chọn màu của Milonic
- JavaScript chọn màu
- JavaScript chọn màu cho các đối tượng

Thêm một hiệu ứng JavaScript khác nữa được giới thiệu trên jsB@nk để tạo một bộ đếm thời gian cực đẹp với giao diện của HTC (một nhà sản xuất điện thoại thông minh rất nổi tiếng của Đài Loan) được xây dựng trên nền tảng jQuery.

Mã nguồn JavaScript của bộ đếm thời gian này đã được xây dựng sẵn, bạn chỉ cần nạp vào trang web và cài đặt chỉ với một vài dòng mã lệnh JavaScript đơn giản. Hãy vào trang ví dụ mẫu JavaScript trực tiếp để thưởng thức hiệu ứng này hoặc xem thêm các bộ đếm thời gian tuyệt đẹp khác đã từng được giới thiệu trên jsB@nk:

- Bộ đếm thời gian độc đáo với jQuery
- Bộ đếm thời gian dạng thanh với jQuery
- Bộ đếm thời gian giảm dần đẹp tuyệt vời

Một đoạn mã JavaScript rất đơn giản nhưng lại tao được một hiệu ứng hộp thoại thông báo bằng AJAX khá tuyệt bởi sự hỗ trợ cực kì mạnh mẽ của thư viện MooTools. Trong ví dụ mẫu JavaScript này, mỗi khi người dùng nhấn nút "Save", hiệu ứng sẽ hiển thị một khung hộp thoại thông báo thao tác thực hiện.

Mã nguồn JavaScript cũng như tài liệu hướng dẫn kĩ thuật được đính kèm đầy đủ bên trong, bạn vui lòng vào trang chi tiết để xem thêm, hoặc dùng thử các hiệu ứng JavaScript với MooTools bên dưới:

- Vài website siêu tuyệt đẹp dùng MooTools
- Trình đơn định hướng kiểu Carousel dùng Mootools

Sưu tập các hiệu ứng JavaScript về các kiểu đồng hồ đẹp và độc đáo là một trong những tiêu chí ban đầu khi tôi lập ra jsB@nk; đến thời điểm bài viết này, có thể nói jsB@nk có số lượng hiệu ứng về đồng hồ cực kì phong phú, trong đó chỉ một số là đẹp, hầu hết còn lại là rất đẹp và tuyệt đẹp [cười:D], với trên 50 hiệu ứng tất cả, bạn có thể kiểm chứng qua liên kết tìm kiếm này: http://www.javascriptbank.com/en+title=clock. Vài hiệu ứng JavaScript được tôi giới thiệu gần đây là:

- jsClock: Đồng hồ số tiện dụng với JavaScript
- Đồng hồ đọc giờ với JavaScript
- CoolClock - Đồng hồ kim tuyệt đẹp với JavaScript

Hôm nay, jsB@nk muốn giới thiệu với bạn thêm một hiệu ứng JavaScript khác để tạo một đồng hồ kim tuyệt đẹp trên trang web. Hiệu ứng đồng hồ kim này được tạo bởi jQuery và Raphaël, cho phép người dùng chọn 1 trong 14 kiểu hiển thị có sẵn (dĩ nhiên bạn có thể dễ dàng thêm các kiểu khác) cùng với việc chỉnh sửa màu sắc của 3 kim giờ, phút và giây. Bạn vui lòng vào trang ví dụ mẫu JavaScript trực tiếp để thưởng thức đồng hồ kim tuyệt đẹp này.

Một đoạn mã JavaScript cực kì tuyệt vời để tạo hiệu ứng trình đơn dạng thẻ để hiển thị thông tin trên trang web. Trình đơn thẻ này có cách thức hoạt động tương tự như các ứng dụng có giao diện dùng thẻ khác và hiệu ứng này có giao diện khá giống với trình duyệt Firefox cùng với các tính năng mà hiệu ứng thẻ này hỗ trợ:
- Tạo không hạn chế thẻ
- Cho phép tạo thêm thẻ thông qua AJAX hoặc IFRAME
- Có thể tạo các thẻ không thể đóng (dành để hiển thị thông tin quan trọng)

Hãy thưởng thức thêm các hiệu ứng thẻ JavaScript tuyệt vời có trên jsB@nk:

- Khung tìm kiếm đơn giản dạng thẻ với CSS
- Các trình đơn dạng thẻ hữu ích
- Tab nội dung
- Tạo các tab
- Tab nội dung

Một bộ đếm thời gian (countdown timer) với giao diện cực kì độc đáo, bắt mắt và sáng sủa để hiển thị trên website của bạn. Hiệu ứng này sẽ đếm số tuần, số ngày và thời gian đến một thời điểm đã được định trước. Bên cạnh đó hiệu ứng còn cho phép người dùng chọn một trong hai giao diện đen hoặc trắng để sử dụng; đồng thời người dùng cũng có thể dễ dàng chỉnh sửa mã nguồn JavaScript hơn bởi hiệu ứng này sử dụng thư viện jQuery làm nền.

Thêm một hiệu ứng tạo bộ đếm thời gian cực kì độc đáo nữa được liệt vào bộ sưu tập các bộ đếm có trên jsB@nk:

- Đồng hồ đếm ngược
- Xây dựng bộ đếm thời gian đơn giản với Flash và ActionScript
- Bộ đếm thời gian dạng thanh với jQuery
- Tạo một bộ đếm thời gian giảm dần theo mô hình OOP
- Bộ đếm thời gian giảm dần đẹp tuyệt vời

Một hiệu ứng JavaScript sử dụng thư viện jQuery để tạo một khung hiển thị tiến trình tải (loading) cực kì độc đáo và đặc sắc trên trang web. Với phiên bản hiện tại được giới thiệu trên jsB@nk, hiệu ứng này cho phép bạn 4 kiểu hiển thị: 3 kiểu hiển thị dạng nút tròn và một kiểu dạng ảnh tự chọn.

Cùng với ví dụ mẫu JavaScript trực tiếp là tài liệu chi tiết cách thức chỉnh sửa mã nguồn JavaScript và hướng dẫn chi tiết, bạn hãy vào trang ví dụ mẫu để thưởng thức nhé.

Hãy thử thêm các hiệu ứng tạo tiến trình tải với JavaScript có trên jsB@nk nếu bạn thích:

- Tỉ lệ tải trang web
- Thanh tiến trình trên trang web
- Thanh phần trăm
- Thanh tiến trình