Cấu trúc code
<marquee scrollamount="3" direction="up" loop="50" scrolldelay="0" behavior="scroll" onmouseover="this.stop()" onmouseout="this.start()">
*** <br />*** <br />***
</marquee>
* Trong đó:
scrollamount và scrolldelay: là điều chỉnh thông số về tốc độ và thời gian.
direction: là hướng chạy của đối tượng mà ta cho chạy. có 4 hướng là: left - right - down - up
loop: là số lần lặp của đối tượng.
behavior: là hiệu ứng chạy của đối tượng, có 3 giá trị: slide - alternate - scroll
slide: chạy tới khi chạm lề thì dừng lại.
alternate: chạy tới khi chạm lề thì chạy ngược lại.
scroll: là kiểu mặt định, kiểu này tự động áp dụng vào tất cả các hình thức còn lại.
onmouseover="this.stop()" onmouseout="this.start()": Đưa trỏ chuột vào thì dừng lại
===========================
1. Chữ chạy ngang từ phải qua trái: Đây là đoạn mã cơ bản nhất, bạn chỉ việc để dòng chữ cần cho chạy vào giữa 2 thẻ MARQUEE là được.
Code: <marquee>Chào mừng các bạn đã đến đây (phải qua trái)</marquee>
2. Chữ chạy ngang từ trái qua phải:
Code: <marquee direction="right">Chào mừng các bạn đã đến đây (trái qua phải)</marquee>
3. Chữ chạy từ trên xuống dưới:
Code: <marquee direction="down" valign="baseline" width="350" height="200">Chào mừng bạn đã đến đây (trên xuống dưới)</marquee>
4. Chữ chạy từ dưới lên trên:
Code: <marquee direction="up" valign="baseline" width="350" height="200">Chào mừng bạn đã đến đây (dưới lên trên)</marquee>
5. Chữ chạy qua lại:
Code: <marquee behavior="alternate">Dòng chữ này chạy qua chạy lại</marquee>
6. Chữ chạy ngang, rê chuột vào thì đứng, đưa chuột ra chạy tiếp:
Code: <marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="8">Dòng chữ này rê chuột vào sẽ dừng lại</marquee>
7. Màu nền, chữ kèm viền khung và hộp nổi:
<div style="background-color:#ffe4e1;color:green"><marquee behavior="alternate" style="border:blue 2px solid;box-shadow: 4px 4px #888888;padding:10px;">Màu nền, chữ kèm viền khung và hộp nổi</marquee></div>
* Chú ý: Nếu bạn dùng hình ảnh thì thay dòng text thành html hình ảnh, ví dụ:
<marquee><img src="https://i.pinimg.com/736x/2f/cd/1a/2fcd1ace40366761b43256adfa146691.jpg" alt="Anhlevan" width="200px"></marquee>
- Chúc các bạn thành công. - Đừng quên chia sẻ trang web này đến mọi người nha bạn, cám ơn.☞ Nếu bạn có bất kỳ vấn đề nào với bài viết này hãy comment vào bên dưới, mình sẽ hồi âm sớm nhất có thể.
* DEMO: