Tạo dòng văn bản di chuyển trên blog kèm theo siêu liên kết

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

I-Tạo một dòng văn bản di chuyển trên blog:

1. Tới Blogger Bảng điều khiển> nhấn vào Bố cục 
2. Bấm vào Thêm tiện ích và chọn "HTML / Javascript 
3. Dán mã dưới đây vào và lưu lại:

Đây là mã để thêm một di chuyển văn bản đơn giản từ bên phải sang bên trái

<marquee> mã để đơn giản di chuyển văn bản </ marquee>

Kết quả: 

mã để di chuyển văn bản đơn giản

Nếu bạn muốn thêm một số chi tiết gây chú ý cho người xem của bạn, hãy thêm các thao tác sau:

- Thay đổi màu nền cho văn bản:

<marquee style="color:#667C26;"> mã để đơn giản di chuyển văn bản </ marquee>

Sản phẩm: 

mã để di chuyển văn bản đơn giản

Bạn có thể chọn màu nền khác TẠI ĐÂY
Dưới đây là một số chế độ thuộc tính để tìm hiểu:

hướng trái = "left"

hướng phải = "right"

hướng lên = "up"

hướng xuống = "down"

Bạn có thể ap dụng các thuộc tính ở trên để thiết lập hướng di chuyển của các văn bản .

VD

<br /> <marquee direction="right" style="color:#99CCFF;"> mã để di chuyển văn bản đơn giản </ marquee> <br />

Đây là những ví dụ của nó:

ản đơn giảnmã để di chuyển văn bản đơn giảnmã để di chuyển văn bản đơn giảnmã để di chuyển văn bản đơn giản

Các thuộc tính khác:
Bạn có thể thêm thuộc tính này để thay thế các văn bản có nghĩa là nó sẽ trả lại trong khu vực màu.

Như thế này:

 chuyển văn bản đơn giản

Mã của nó: 

<marquee behavior="alternate" direction="down" bgcolor="#33FFCC"> mã để đơn giản di chuyển văn bản </ marquee>

Bạn cũng có thể thiết lập  tốc độ lên  các văn bản  với một thuộc tính đơn giản:

scrollamount = "2"

Thấp hơn di chuyển số lượng giá trị, tốc độ ít di chuyển,
mã html thêm scrollamount sẽ là:

<marquee behavior="alternate" direction="left" scrollamount="2" style="color:#9999CC;"> mã để đơn giản di chuyển văn bản </ marquee>

Cho scrollamout = 2 trong vùng này, nó sẽ được ở tốc độ này:

mã để di chuyển văn bản đơn giản

Cho scrollamount = 10 sẽ có tốc độ này:

mã để di chuyển văn bản đơn giản

II. Tạm dừng các văn bản khi di chuột trên văn bản:     

 Nó rất hữu ích khi người đọc muốn đọc văn bản. Đây là mã cho nó:

<marquee behavior="alternate" direction="left" onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" scrolldelay="50" style="color:#CCCCCC;"> mã để đơn giản di chuyển văn bản </ marquee>

Nó sẽ có hiệu ứng như sau:

mã để di chuyển văn bản đơn giản

III-  Thay đổi màu sắc văn bản:

 Đây là mã để thay đổi màu sắc văn bản: ( Thêm nó trước thẻ marquee )

<span style="#FFFFFF">

Toàn bộ mã sẽ như thế này:

<span> <marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="4" style="color:#cccccc;"> <br /> <br /> mã để di chuyển đơn giản văn bản <br /> <br /> </ marquee>

mã để di chuyển văn bản đơn giản

IV- Thêm siêu liên kết vào trong văn bản (mở trong cùng một cửa sổ):

Đây là một trong những điều quan trọng và hữu ích nhất, thêm các siêu liên kết trong văn bản di chuyển 

Hãy xem cách để thêm liên kết đến các văn bản di chuyển:

Sode mẫu :

<marquee behavior="scroll" direction="left" bgcolor="#99FFFF" onmouseover="this.stop()" onmouseout="this.start()" scrollamount="4"> <a href = "url # 1 "> LINK # 1 </ a> <a href="url#2"> LINK # 2 </ a> <a href="url#3"> LINK # 3 </ a> </ marquee>

Thay thế  các liên kết # 1, Link # 2, # 3 Liên kết với các văn bản và url # 1, # 2 và địa chỉ url # 3 với các địa chỉ url mong muốn.

<marquee behavior="scroll" align="middle" direction="left" scrollamount="4" onmouseover="this.stop()" onmouseout="this.start()" style="color:#99FFFF;"> <br /> <br /> <a href="#your link"> liên kết của bạn </ a> <a href="#"> biểu đồ màu </ a> <a href = "http://www.google com. "> google </ a> <br /> <br /> </ marquee>

liên kết của bạn màu biểu đồ google

Nếu bạn muốn  mở các liên kết trong cửa sổ mới , đây là đoạn code cho nó:

<marquee behavior="scroll" direction="left" bgcolor="#99FFFF" onmouseover="this.stop()" onmouseout="this.start()" scrollamount="4"> <a href = "url # 1 "> LINK # 1 </ a> <a href="url#2"> LINK # 2 </ a> <a href="url#3"> LINK # 3 </ a> </ marquee>

Bây giờ bạn có thể thêm nội dung này vào blog sidebar của bạn, trong các bài đăng blog hoặc nơi nào bạn muốn....Lưu các thay đổi  và ra xem thành quả.

Thật đơn giản phải không nào?

Chúc bạn thành công !...

                                                                                    Nguồn tham khảo: bdlab.blogspot.com