TẠO CHỮ CHUYỂN ĐỘNG TRÊN BLOG

Đăng bởi Admin | 4/6/13 | 0 nhận xét

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ẻ Marquee</Marquee>

Chữ bình thường theo mặc định chạy từ trái sang phải.

Chữ chạy từ phải sang trái với thẻ Marquee

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. Tham khảo Biểu đồ Mã HTML Color cho các mã màu.

- Height = "50px" 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%"

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>

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

+ 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>

Chống cuộn văn bản bằng cách sử dụng các hành vi thay thế

Ở đâ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 sau các dòng trước</Marquee>.

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 sau các dòng trước

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 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 : <Marquee direction="right" scrollamount="3" bgcolor="#333333">Text và các đoạn code HTML khác</Marquee>

Ví dụ 06 : <Marquee direction="right" scrollamount="3" bgcolor="#333333"> Cuộn văn bản từ phải sang trái</Marquee>

Cuộn văn bản từ phải sang trái

Ví dụ tiếp : <Marquee direction= "" scrollamount = "3" bgcolor = "# 333333" > Cuộn văn bản từ trái sang phải </Marquee>

Cuộn văn bản từ trái sang phải

+ 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>

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

+ Cách dùng 08 : <Marquee> Text và các đoạn code HTML khác và liên kết hình ảnh</Marquee>

Ví dụ 08 : <Marquee> Hi! Chào! <IMG SRC="s1258.photobucket.com/albums/ii522/Allpicture2012/?action=view&current=b.gif" HEIGHT=82 WIDTH=82 ></Marquee>

Hi Chào!

CHÈN THẺ MARQUEE TRONG BLOGGER

1/ Chèn vào bài viết : Trong bài viết chuyển qua chế độ soạn thảo HTML

Chèn thẻ Marquee vào vị trí muốn chèn. Nhưng không chèn vào giữa những thẻ khác, Thường là chèn vào cuối thẻ </div>

Ví dụ : ........ </div> (đóng của thẻ trên)

Viết thẻ marquee vào giữa 2 thẻ

<div> ......... (mở của thẻ dưới)

Nhớ đóng thẻ </marquee> nhé, nếu không văn bản sẽ chạy từ đó cho đến cuối bài.

+ Với chương trình vietnamgiapha-3.1.5.x.exe: Chèn thẻ Marquee ngay trong phần Phả ký, thủy tổ, hương hỏa v.v... Sau đó cập nhật lên web.

2/ Chèn vào Header : Cái nầy thì làm đẹp cho tiêu đề của blog mình đây. Click vào bố cục.

Click vào thêm tiện ích

Click vào HTML/Javascript

Nhập thẻ Marquee vào phần nội dung. Tiêu đề thì để trống. Xong nhấp nút lưu.

Đè chuột trái kéo HTML thả lên trên

Cuối cùng thì được như thế nầy

Hoàn thành rồi, nhưng phải Click nút lưu sắp xếp đấy nhé.

Chúc thành công!

Theo: vqbgiapha

Thu thuat vi tinh

Không có nhận xét nào:

Đăng nhận xét

Cảm ơn bạn đã nhận xét !
- Bạn có thể chèn link vào nhận xét bằng thẻ: <a href="Link" rel="nofollow">Tên link</a>
- Tạo Chữ đậm và Chữ ngiêng cho nhận xét
- Hãy Chuyển đổi mã code trước khi chèn vào nhận xét
- Hãy bấm Theo dõi dưới chân trang để nhanh chóng nhận được phản hồi từ Thủ thuật vi tính
- Những nhận xét nào không lành mạnh hoặc chèn link spam sẽ bị xóa khỏi blog.

Mã hóa Code

4/6/13