Text chuyển động với Marquee tag
Thẻ trong HTML điều khiển text area hay images trượt theo ý muốn, rất hữu ích nếu bạn muốn làm nổi bật một vùng nào đó trong trang web cho người xem để ý. Marquee tag có vài thuộc tính (attribute) cơ bản nhưng cũng đủ cho ta tạo được một text chuyển động thật như ý
Cú pháp:
Attributes và values:
ALIGN : top, bottom, right, left, middle
HEIGHT, WIDTH
BEHAVIOR : scroll, slide, alternate
DIRECTION : up, down, left, right
HSPACE, VSPACE
LOOP : -1, n
SCROLLAMOUNT, SCROLLDELAY
BGCOLOR, CLASS, STYLE
Giải thích:
ALIGN: căn lề cho text bên trong thẻ, đoạn text này sẽ dồn về phía mà ta định.
HEIGHT, WIDTH: bề rộng và bề ngang của vùng Marquee. Ví dụ:
BEHAVIOR: scroll - trượt hết miền marquee và bắt đầu lại từ đầu, slide - trượt đến điểm cuối miền marquee (tính theo hướng trượt) và đứng lại tại đó, alternate - trượt qua lại. Ví dụ:
<... behavior="alternate">Text Here
DIRECTION: hướng trượt. Ví dụ:
<... direction="right">Text Here
HSPACE, VSPACE: khoảng cách ngang và dọc giữa text xung quanh và rìa vùng Marquee. Ví dụ:
<... hspace=100>Text Here
LOOP: lặp lại số lần trượt, nếu -1 : lặp lại vĩnh viễn. Ví dụ:
<... loop="-1">Text Here
SCROLLAMOUNT, SCROLLDELAY: đột mượt và độ nhanh chậm của text trượt. SCROLLAMOUNT càng nhỏ thì càng mượt. SCROLLDELAY càng lớn thì càng chậm. Ví dụ:
<... scrollamount="5" scrolldelay="50">Text Here
BGCOLOR, CLASS, STYLE: định style cho marque thí dụ như màu nền, text bên trong,... (đòi hỏi phải biết chút css).
Trên đây là một số thuộc tính cơ bản của Marquee mà tôi được biết. Ngoài ra còn một số sự kiện tương tác của người dùng tới marquee, thí dụ như onclick, onmouseover,... bạn hãy tự nghiên cứu thêm về cái này nhé. Tôi làm một ví dụ: khi user rà chuột vào marquee (onmouseover), nếu tôi muốn đoạn text đang chuyển động tạm dừng, sau khi user không rà chuột vào nữa (onmouseout), đoạn text lại tiếp tục chuyển động? thì làm như sau:
<... onmousemove="this.stop()" onmouseout="this.start()">Text Here
Hãy tiếp tục khám phá nhé, chắc chắn bạn sẽ biết được nhiều điều thú vị hơn nữa.
Cú pháp:
Attributes và values:
ALIGN : top, bottom, right, left, middle
HEIGHT, WIDTH
BEHAVIOR : scroll, slide, alternate
DIRECTION : up, down, left, right
HSPACE, VSPACE
LOOP : -1, n
SCROLLAMOUNT, SCROLLDELAY
BGCOLOR, CLASS, STYLE
Giải thích:
ALIGN: căn lề cho text bên trong thẻ, đoạn text này sẽ dồn về phía mà ta định.
HEIGHT, WIDTH: bề rộng và bề ngang của vùng Marquee. Ví dụ:
BEHAVIOR: scroll - trượt hết miền marquee và bắt đầu lại từ đầu, slide - trượt đến điểm cuối miền marquee (tính theo hướng trượt) và đứng lại tại đó, alternate - trượt qua lại. Ví dụ:
<... behavior="alternate">Text Here
DIRECTION: hướng trượt. Ví dụ:
<... direction="right">Text Here
HSPACE, VSPACE: khoảng cách ngang và dọc giữa text xung quanh và rìa vùng Marquee. Ví dụ:
<... hspace=100>Text Here
LOOP: lặp lại số lần trượt, nếu -1 : lặp lại vĩnh viễn. Ví dụ:
<... loop="-1">Text Here
SCROLLAMOUNT, SCROLLDELAY: đột mượt và độ nhanh chậm của text trượt. SCROLLAMOUNT càng nhỏ thì càng mượt. SCROLLDELAY càng lớn thì càng chậm. Ví dụ:
<... scrollamount="5" scrolldelay="50">Text Here
BGCOLOR, CLASS, STYLE: định style cho marque thí dụ như màu nền, text bên trong,... (đòi hỏi phải biết chút css).
Trên đây là một số thuộc tính cơ bản của Marquee mà tôi được biết. Ngoài ra còn một số sự kiện tương tác của người dùng tới marquee, thí dụ như onclick, onmouseover,... bạn hãy tự nghiên cứu thêm về cái này nhé. Tôi làm một ví dụ: khi user rà chuột vào marquee (onmouseover), nếu tôi muốn đoạn text đang chuyển động tạm dừng, sau khi user không rà chuột vào nữa (onmouseout), đoạn text lại tiếp tục chuyển động? thì làm như sau:
<... onmousemove="this.stop()" onmouseout="this.start()">Text Here
Hãy tiếp tục khám phá nhé, chắc chắn bạn sẽ biết được nhiều điều thú vị hơn nữa.
0 Nhận xét:
Post a Comment
Bạn hảy gõ nhận xét vào ô dưới. Cảm ơn bạn!