Một số bạn hỏi tôi về
tạo chữ chạy trong Blogger. Đó là lý do để tôi viết hướng dẫn nhỏ giúp các bạn
thực hiện thủ thuật nầy. Hướng dẫn này không chỉ dành riêng trong blogger mà
còn sử dụng được cho một số blog khác và dĩ nhiên hướng dẫn nầy cũng xài được
trong vietnamgiapha.com mà tôi thường theo dõi.
Hướng dẫn nầy xử dụng thẻ Marquee - HTML code mà đa số đều đã biết. Nhưng đoạn code được đặt ở những vị trí khác nhau thì sẽ sẽ hiển thị ở những phần khác nhau.Điều này sẽ được hướng dẫn ở cuối bài. Chúng ta hãy xem qua một số code từ đơn giản đến phức tạp và ví dụ trước.
HTML Marquee : Thuật ngữ này được sử
dụng để tạo ra một văn bản di chuyển hoặc trượt.
+ Cách dùng 01 : <Marquee> Text và các đoạn code
HTML khác</Marquee>
Ví dụ 01 : <Marquee> Chữ chạy từ phải sang trái với thẻ <B> Marquee</B></Marquee>
Chữ bình thường theo
mặc định chạy từ trái sang phải.
Ta thường thêm vào một
số thuộc tính khác để chủ động điều khiển theo ý thích. Tuy nhiên đừng nên quá
màu mè hoặc lạm dụng sẽ làm loãng trang blog.
Trước khi xem tiếp
những cách dùng khác ta cần biết một số thuộc tính của thẻ Marquee. Hoặc xem
tiếp cách dùng và tham khảo ngược cũng được.
MỘT SỐ THUỘC TÍNH KHÁC CỦA
THẺ MARQUEE
-
Direction = Left,
Right, Up, Down (“Trái” - “Phải” - “Lên” - Xuống”)
Direction = "Left "
Direction = "Right"
Direction = "Up"
Direction = "Down"
Mặc định là left (trái) nếu không chỉ định.
-
Loop = "5"
Đặt số lượng thời gian
vùng chọn sẽ di chuyển. Ví dụ, trong Internet Explorer, nếu số lượng là 5, vùng
chọn (văn bản) sẽ di chuyển 5 lần và dừng lại. Lệnh này có thể được bỏ qua bởi
Firefox và các văn bản tiếp tục di chuyển. Đối với các trình duyệt, nếu không
có giá trị được quy định cụ thể hoặc nếu thuộc tính này được bỏ qua, vùng chọn
sẽ di chuyển hay lặp liên tục.
-
Scrollamount
= "1"
Nếu là 1, văn bản di
chuyển; cuộn với tốc độ chậm. Nếu thuộc tính này chưa được nêu rõ, giá trị mặc
định là 6 - di chuyển; cuộn nhanh hơn.
-
Scrolldelay
= "100"
Thiết lập khoảng thời
gian giữa mỗi động tác di chuyển trong mili giây. Giá trị mặc định là 85. Giá
trị càng cao, tốc độ cuộn càng chậm. Giá trị nhỏ hơn 60 sẽ được bỏ qua và thay
thế bằng giá trị 60.
-
Bgcolor: rgb (255,0,0) "> #
XXXXXX"
Màu nền cho văn bản di
chuyển.
-
Height = "50px"
hoặc Height = "80%"
hoặc Height = "80%"
Chiều cao của hộp vùng
chọn bằng pixel hoặc giá trị phần trăm. Giá trị mặc định là chiều cao chứa văn
bản.
-
Width = "200px"
hoặc = "80%"
hoặc = "80%"
Tương tự chiều rộng
của hộp vùng chọn bằng pixel hoặc giá trị phần trăm.
-
Vspace = "20px"
Vspace = "80%"
Thiết lập lề trên và
dưới các văn bản di chuyển bằng pixels hoặc tỷ lệ phần trăm.
-
Hspace = "20px"
Hspace = "80%"
Thiết lập lề trái và
phải các văn bản di chuyển bằng pixel hoặc tỷ lệ phần trăm.
-
Behavior="Scroll"
behavior = "Alternate"
behavior = "Slide"
Phương
pháp cuộn chữ. Giá trị gồm: Scroll, Slide, Alternate.
-
Scroll : Cuộn không ngừng.
-
Slide : Di chuyển theo 1 hướng rồi dừng lại.
-
Alternate : Đổi hướng di chuyển khi chạm vào biên. (văn vản đong đưa)
+ Cách dùng 02 : <Marquee
bgcolor="#ffffcc"> Text và các đoạn code HTML khác </ Marquee>
Ví dụ 02 : <Marquee bgcolor="#ffffcc"> Cuộn văn bản từ phải sang trái theo mặc định với nền màu vàng nhạt.</ Marquee>
+ Cách dùng 03 : <Marquee
behavior="alternate" width="80%"
bgcolor="#ffffcc"> Text và các đoạn code HTML khác </ Marquee>
Ví dụ 03 : <Marquee behavior="alternate" width="80%" bgcolor="#ffffcc"> Chống cuộn văn bản bằng cách sử dụng các hành vi thay thế. </ Marquee>
Ở đây, văn bản bị trả
lại từ một bên khác và chiều rộng của hộp văn bản đã được giảm xuống 80%, nền
văn bản màu vàng nhạt. Ta thấy các thuộc tính của thẻ marquee được viết cách
nhau bởi khoảng trắng và không có dấu phảy.
* <Marquee behavior=“scroll”> Cuộn văn bản không ngừng </Marquee>
* <Marquee behavior=“slide”> Di
chuyển văn bản theo 1 hướng rồi dừng lại </Marquee>
* <Marquee behavior=“alternate”> Đổi hướng di chuyển văn bản khi chạm vào biên </Marquee>
+ Cách dùng 04 : <Marquee scrolldelay="150"
direction="up" width="300px" height="100px"
bgcolor="#ffffcc">Text và các đoạn code HTML khác</ Marquee>.
Ví dụ 04 : <Marquee scrolldelay="150" direction="up" width="300px" height="100px" bgcolor="#ffffcc"> Văn bản cuộn trở lên. Để văn bản xuất hiện trong các dòng tiếp theo, thêm <p> </ p> sau các dòng trước</ Marquee>.
Scrolldelay đã được
thiết lập ở mức 150. Tăng giá trị này nếu bạn muốn có một tốc độ chậm hơn.
+ Cách dùng 05 : <Marquee
hspace="50%" direction="down" scrollamount="2"
height="100px" bgcolor="#ffffcc">Text và các đoạn code
HTML khác</ Marquee>.
Ví dụ 05 : <Marquee hspace="50%"
direction="down" scrollamount="2" height="100px"
bgcolor="#ffffcc"> Văn bản cuộn xuống dưới.
Để văn bản xuất hiện trong các dòng tiếp theo, thêm <p> </ p> sau
các dòng trước đó </Marquee>.
Sử dụng Scrollamount
để kiểm soát tốc độ. Giá trị cao hơn, tốc độ nhanh hơn (mặc định : 6). Lề trái
và phải thiết lập theo hspace.
Chú ý trong ví dụ trên
văn bản là màu đen. Nếu bạn muốn có một màu sắc hay phong cách khác nhau cho
văn bản của bạn, bạn có thể thiết lập phong cách của văn bản với mã màu và
hướng khác. Dưới đây là một số ví dụ:
+ Cách dùng 06 : <Span
style="color:#F6358A; font-weight:bold;"> <Marquee
direction="right" scrollamount="3"
bgcolor="#333333">Text và các đoạn code HTML khác</ Marquee> </ Span>
Ví dụ 06 : <Span
style="color:#F6358A; font-weight:bold;"> <Marquee
direction="right" scrollamount="3"
bgcolor="#333333"> Cuộn văn bản từ trái sang
phải </ Marquee> </ Span>
Ví dụ tiếp : <Span
style="color:#6AFB92; font-size:xx-large; font-family:fantasy;
font-weight:bold;"> <Marquee direction= "" scrollamount =
"3" bgcolor = "# 333333" > Cuộn văn bản từ trái sang phải </ Marquee>
</ Span>
+ Cách dùng 07 : <Marquee
bgcolor="#ffffcc" onmouseover="this.stop()"
onmouseout="this.start()">Text và các đoạn code HTML khác < / Marquee>
Ví dụ 07 : <Marquee bgcolor="#ffffcc"
onmouseover="this.stop()" onmouseout="this.start()"> Văn bản di chuyển tạm dừng khi di chuột lên nó và bắt đầu lại khi di
chuột ra khỏi< / Marquee>