Tạo hiệu ứng chữ chạy với thẻ Marquee trong HTML5

Marquee là một mã HTML để làm cho một đối tượng có thể chuyển động. Marquee mã là một mã phổ biến vì nhiều blogger sử dụng mã này vào blog của họ.

Tạo hiệu ứng chữ chạy với thẻ Marquee trong HTML5

Lệnh Marquee được thực hiện bằng cách sử dụng thẻ <marquee> {đối tượng}</marquee>. Lệnh marquee hiển thị tốt nếu xem tại trình duyệt Internet Explorer, tuy nhiên các trình duyệt khác sau này có nhiều phiên bản mới đã cũng có thể hiển thị tốt như IE.

Một số các thuộc tính thường dùng của lệnh marquee:

  • BGCOLOR="color" → tạo màu nền cho vùng hiện thị lệnh marquee (có thể dùng hình nền…).
  • DIRECTION="left/right/up/down" → chọn hình thức chạy chữ ( trái, phải, lên, xuống…)
  • BEHAVIOR="scroll/slide/alternate" → thiết lập kiểu chạy chữ .

  1. Scroll → di chuyển tuần tự.
  2. Slide → di chuyện 1 thời gian, sau đó dừng lại.
  3. Alternate → di chuyển từ trái sang phải sau đó dừng lại.

  • TITLE="message" → Một đọan tin nhắn nhỏ được hiển thị khi người dùng rê chuột vào.
  • SCROLLMOUNT="number" → điều chỉnh tốc độ chạy
  • SCROLLDELAY="number" → chỉnh thời gian hiển thị (tính bằng giây)
  • LOOP="number|-1|infinite" → to manage sum of looping.
  • WIDTH="number" → chỉnh độ rộng của vùng chạy chữ. Có thể dùng đơn vị pixel (px) hoặc phần trăm (%).

Một vài ví dụ:

<marquee align="center" direction="left" height="100" scrollamount="2" width="100%">Chuyển động từ trái qua phải, độ rộng 100%, cao 100px, tốc độ chạy chữ là 2</marquee>{codeBox}

Kết quả hiển thị:

See the Pen Test Marquee by truongblogger (@truongblogger98) on CodePen.

Chạy chữ qua trái rồi quay lại qua phải (thuộc tính alternate)

<marquee align="center" direction= "left" height="200" scrollamount="4" width="100%" behavior="alternate">Chạy chữ qua trái rồi quay lại qua phải (thuộc tính alternate)</marquee>{codeBox}

Kết quả hiển thị:

See the Pen Test Marquee 2 by truongblogger (@truongblogger98) on CodePen.

Đánh giá của bạn về bài viết này?

Trường

Chia sẻ những gì mình biết là cách ý nghĩa nhất để lưu lại giá trị của đời mình cho cộng đồng. Cho đi là cách nhận lại thông minh nhất. facebook flickr share

Nếu bổ ích hãy mời mình 1 ly nước mía 5k qua MoMo nhé: 085.45.74.559

Đăng nhận xét Hãy là người "bóc tem"

➥ Nhập địa chỉ Email bạn hay dùng để nhận thông báo khi mình trả lời bình luận của bạn (Tích vào ô Thông báo cho tôi).
➥ Gửi kèm ảnh chụp màn hình để được hỗ trợ tốt nhất. Up ảnh lên trang Upload Image, sau đó sao chép link ảnh dán vào khung bình luận.
➥ Không spam trong khung bình luận, hạn chế viết tắt. Xem quy định bình luận tại đây.