Để tiếp tục những bài thực hành nhỏ với jQuery, trong bài này chúng ta sẽ xây dựng một Image Rotator đơn giản. Có nhiều bạn comment hỏi sao không làm thêm next prev v.v… Những cái đó người ta đã có hết plugin rồi. Nếu bạn muốn có thể download plugin về để làm.
Tôi cũng đã có video hướng dẫn về cách sử dụng plugin Looped Slider trong series về WP theme, nếu muốn bạn cũng có thể xem. Bài này với mục đích quan trọng nhất là cho bạn có cơ hội thực hành những kiến thức đã học. Vì học code cách lẹ nhất là thực hành. Thứ hai đôi khi bạn không muốn dùng những Plugin đồ sộ cho những tác vụ đơn giản. Đôi khi bạn chỉ muốn nó tự động chuyển ảnh thôi chứ không muốn những chức năng khác.
Chú ý: Tuy bài này làm về hình ảnh, nhưng bạn có thể áp dụng tương tự cho các thành phần khác như thẻ div, p hoặc li để tạo ra hiệu ứng thay đổi nội dung chữ cũng được.
Đính chính:
Ở đoạn gần cuối trong video tôi bị nhầm một giá trị là curImg và nextImg cho nên kết quả sau vòng lặp đầu tiên sẽ bị giật. Bạn phải đổi lại với dòng mã sau: (đổi từ nextImg -> curImg
curImg.removeClass('previous');
Rất cảm ờn bạn Toàn đã chỉ ra lỗi này
