Mã đề C - Lần 2

Đề bài: Ứng dụng trình chiếu ảnh điều khiển bằng phím

Ngữ cảnh: Trình chiếu 1 bộ ảnh (dùng khối màu đại diện cho ảnh), chuyển ảnh bằng nút bấm hoặc bằng phím mũi tên trái/phải trên bàn phím, có chức năng tự động phát.

Yêu cầu

  1. Có nút "Ảnh trước", "Ảnh sau", "Phát tự động", "Dừng tự động", "Về ảnh đầu tiên", khu vực hiển thị ảnh hiện tại.
  2. Bổ sung xử lý cho tối thiểu 3 loại sự kiện khác ngoài click: mouseover/mouseout để hiện/ẩn chú thích khi rê chuột vào các nút, và keydown để bắt phím mũi tên.
  3. Có 1 chức năng chỉ dùng được bằng bàn phím: nhấn phím mũi tên trái/phải để chuyển ảnh khi không dùng chuột (không bắt buộc phải bấm nút).
  4. Toàn bộ hàm xử lý phải tách riêng khỏi phần gắn sự kiện, đặt tên hàm rõ nghĩa.
  5. Vẽ và nộp kèm sơ đồ event workflow của tối thiểu 2 tương tác trong bài (ví dụ: bấm nút Ảnh sau và nhấn phím mũi tên phải). Xem ví dụ sơ đồ trong dapan.html.
  6. Giữ nguyên toàn bộ yêu cầu Lần 1: addEventListener cho mọi sự kiện, tối thiểu 5 nút chức năng, 1 phần tử có 2 hàm xử lý cho cùng sự kiện click, bộ đếm thao tác.

Kết quả mong đợi tương tự hình minh họa dưới đây (xem file dapan.html để đối chiếu chi tiết):

Ràng buộc cấu trúc riêng cho mã đề C

Section có header riêng: Dùng một section có header con riêng, trong đó header chứa tiêu đề ngắn và đoạn mô tả. Không thay ràng buộc này bằng cấu trúc của mã đề khác.

Ảnh chụp minh họa kết quả bài Ứng dụng trình chiếu ảnh điều khiển bằng phím