google+javascriptbanktwitter@js_bankfacebook@jsbankrss@jsbank






JavaScript xoay ảnh với CANVAS trong HTML5 Xoay ảnh với JavaScript không phải loại hiệu mới trên jsB@nk bởi chúng đã từng được giới thiệu thông qua rất đoạn mã JavaScript như:

- Quay một đối tượng mà không cần ảnh
- Thế giới quay
- Ảnh quay

Tuy nhiên để bắt kịp với xu hướng của bạn bè trên khắp thế giới, jsB@nk muốn giới thiệu với bạn thêm một hiệu ứng JavaScript xoay ảnh nữa, nhưng được xây dựng trên nền HTML5 với tập lệnh canvas. Đoạn mã JavaScript xoay ảnh này khá đơn giản để bạn có thể nắm bắt cách thức sử dụng thư viện canvas trong HTML5 với các phương thức như: setAttribute, getContext, drawImage và rotate.


Đổi ảnh khi rê chuột Một đoạn mã JavaScript khác dùng để đổi ảnh khi người dùng rê con trỏ chuột đến. Trong hiệu ứng JavaScript này, thay vì dùng cách thông thường, đoạn mã JavaScript thiết lập thuộc tính mới oversrc chứa đường dẫn ảnh cần đổi.


Chuyển ảnh tự động Một đoạn mã JavaScript JavaScript khác để chúng ta có thể đổi ảnh liên tục trong khoảng thời gian nào đó.


Slideshow với bộ lọc Đoạn mã này dùng bộ lọc mờ dần của IE để tạo hiệu ứng trình diễn ảnh trên trang web. Bạn cần có IE5.5+ để thấy được hiệu ứng chuyển cảnh, mặc dù chức năng đổi ảnh làm việc trong tất cả trình duyệt.


Hiệu ứng chuyển ảnh Hiệu ứng JavaScript này sẽ chuyển đổi ảnh sau một khoảng thời gian xác định. Bạn có thể áp dụng hiệu ứng JavaScript này với nhiều hình ảnhliên kết như bạn muốn.


Ảnh thay đổi khi rê chuột Hiệu ứng tạo ra ba trạng thái ảnh trên trang web: ảnh lúc bình thường, khi người dùng rê chuột đến và khi được nhấn.


Ảnh cát đổ theo hai chiều Hiệu ứng trình bày ảnh theo nguyên tắc hiển thị từng điểm ảnh theo hai chiều từ trái sang phải và ngược lại.


Trình diễn ảnh ba chiều Hiệu ứng tạo một trình diễn ảnh ba chiều qua một hình cầu, hai mặt của quả cầu sẽ lần lượt đổi các ảnh khác nhau.


Cuộn ảnh với hiệu ứng mờ Hiệu ứng tạo một trình diễn ảnh theo chiều từ phải sang trái với hai đầu bị làm mờ dần, khi ta rê con trỏ chuột đến thì ảnh ngừng di chuyển.


Chuyển ảnh mờ dần Đoạn mã JavaScript tạo một trình chuyển ảnh theo nguyên tắc các ảnh xuất hiện và biến mất với hiệu ứng mờ dần. Một hiệu ứng rất tuyệt và được rất nhiều trang web sử dụng hiện nay.


JavaScript theo ngày


Google Safe Browsing McAfee SiteAdvisor Norton SafeWeb Dr.Web