Thích trang
    Trở thành fan của Tanchau123.blogspot.com

    Bạn muốn nhận tin tức mới nhất từ Tanchau123.blogspot.com? Hãy nhấn nút "Thích" bên dưới để nhận thông tin mới nhất từ chúng tôi trên Facebook.

T

a

n

chau123

Blog Giải Trí Tổng Hợp

trang chủ
Báo lỗi bài
    Báo lỗi thông tin bài viết

    Nhập thông tin báo lỗi vào ô bên dưới

10:40 ngày 25/5/12

Code Liên Kết Sử Dụng Hiệu Ứng Trượt

Bạn muốn tạo cho blog / web mình một khung liên kết bạn bè nhưng lại muốn làm nó trông mượt hơn, điều này hoàn toàn có thể làm được. Tình cờ ghé thăm blog KTV, Tanchau123 đã thấy bài viết tạo "code liên kết bạn bè rất hay" và đã đem về áp dụng cho blog. Tuy nhiên điểm yếu bên code của Blog KTV là liên kết không được mở trong tab mới khi ta click vào. Vì vậy Tanchau123 đã chỉnh sữa lại phần này và cho ra đời bài viết hôm nay.





                                                                            






CÁC BƯỚC THỰC HIỆN:

1. Đăng nhập Blogger.
2. Vào Thiết Kế => Phần Tử Trang => Thêm Tiện Ích
3. Chọn HTML/Javascript và paste toàn bộ đoạn code sau vào:

<!-- Code by http://tanchau123.blogspot.com -->
<style>
#lienketbanbe {
 width: 280px; border: 0px solid #333;
 overflow: auto;
 height: 250px; padding-left: 0px;
}
#lienketbanbe  ul {
 display: inline;
 margin-left: 0px;
}
#lienketbanbe  ul li {
 list-style: none;
 margin-left: 0px;
 background: #555353;
 border: 1px solid #fff;
 padding: 4px;
 padding-left: 15px;
-webkit-transition:all 3.5s ease;
 -moz-transition:all 3.5s ease;
 -o-transition:all 3.5s ease;
 transition:all 3.5s ease;
}
#lienketbanbe  ul li:hover {
 background: #00A2E8;
 border : 1px solid #fff;
 border-right: 10px solid #fff;
-webkit-transition:all 1.5s ease;
 -moz-transition:all 1.5s ease;
 -o-transition:all 1.5s ease;
 transition:all 1.5s ease;
}
#lienketbanbe  ul li a {
 color: #fff;
 text-decoration: none;
 font-family: Comic Sans MS;
 font-size: 16px;
 text-shadow: 0px 0px 1px #fff;
 -webkit-transition: padding 1.5s ease-out;
    -moz-transition: padding 1.5s ease-out;
    -o-transition: padding 1.5s ease-out;
 transition:all 1.5s ease;
}

#lienketbanbe  ul li a:hover {
 color: yellow;
 text-decoration: none;
 padding-left: 15px;
 -webkit-transition: padding 0.5s ease-out;
    -moz-transition: padding 0.5s ease-out;
    -o-transition: padding 0.5s ease-out;
 transition:all 0.5s ease;
}
</style>
<div id="lienketbanbe">
<ul>
<li><a href="http://tanchau123.blogspot.com/" target="_blank" style="color:red;">Blog Giải Trí Tổng Hợp</a></li>
<li><a href="http://phimcuatoi.blogspot.com/" target="_blank" style="color:red;">Phimcuatoi</a></li>
<li><a href="http://green-vietnam.com/" target="_blank">Green Việt Nam</a></li>
<li><a href="http://www.tintucdulich.info/" target="_blank">Vịnh Nam Lang</a></li>
<li><a href="http://namkna.blogspot.com/" target="_blank">Namkna Blog</a></li>
<li><a href="http://nguyenhaiblog.blogspot.com/" target="_blank">Nguyễn Hải Blog</a></li>
<li><a href="http://dungsoma.tk/" target="_blank">Đừng Sợ Ma</a></li>
<li><a href="http://www.hynls.info/" target="_blank">Hynls Blog</a></li>
<li><a href="http://hoangphamblog.blogspot.com/" target="_blank">Hoàng Phạm Blog</a></li>
<li><a href="http://mailenoni.blogspot.com/" target="_blank">Sản Phẩm Từ Trái Nhàu</a></li>
<li><a href="http://www.truyendich.net/" target="_blank">Truyện Dịch</a></li>
<li><a href="http://www.voquocan.com/" target="_blank">Võ Quốc An Blog</a></li>
<li><a href="http://www.vankhuong.com/" target="_blank">Văn Khương</a></li>
<li><a href="http://tranphucminh.blogspot.com/" target="_blank">Trần Phúc Minh Blog</a></li>
<li><a href="http://blogtructuyenvn.blogspot.com/" target="_blank">Blog Trực Tuyến</a></li>
<li><a href="http://www.dingkiutrue.com/" target="_blank">Đing Kiu Truê Blog</a></li>
<li><a href="http://www.thuthuat-mya5class.blogspot.com/" target="_blank">Mya5class</a></li>
<li><a href="http://www.blogktv.net/" target="_blank">Blog KTV</a></li>
<li><a href="http://vn-anime.blogspot.com/" target="_blank">VN-anime</a></li>
<li><a href="http://boxgiaitri.net/" target="_blank">Box Giải Trí</a></li>
<li><a href="http://giaitri89.blogspot.com/" target="_blank">Giaitri89</a></li>
<li><a href="http://www.conguyet.com/" target="_blank">Cổ Nguyệt Blog</a></li>
<li><a href="http://mayanheway.blogspot.com/" target="_blank">Máy Ảnh Số</a></li>
<li><a href="http://kenhtruyen.com/" target="_blank">Kênh Truyện</a></li>
</ul>
</div>
<!-- Code by http://tanchau123.blogspot.com -->

CHÚ Ý: Nhớ thay các đường link màu đỏ ở trên lại sao cho phù hợp với blog / web bạn. Nếu muốn thay đổi chiều rộng hoặc chiều cao của tiện ích thì tìm đoạn code width: 280px;  height: 250px; sửa 280px250px lại.


4. Lưu tiện ích lại và xem kết quả.
Chúc các bạn thành công !!!


Theo BlogKTV

Mới cập nhật

14 nhận xét

· Thêm biểu tượng cảm xúc

  1. Đổi link lại ở blog em dùm: http://blogthuthuat247.blogspot.com/
    Title: Bong Thủ Thuật 24/7

    Trả lờiXóa
  2. Anh chỉ em đưa blog mình lên bộ máy tìm kiếm của Google, yahoo,

    Trả lờiXóa
  3. Cái liên kết này để làm gì vậy cậu . Mới tham gia viết chẳng hiểu , với lại thấy mọi ng` cứ xin vs đặt backlink cũng k hiểu lun @-)

    Trả lờiXóa
    Trả lời
    1. Cái này dùng để tạo liên kết với các "đồng nghiệp" hoặc bạn bè. Khi ta click vào tên một trang thì nó sẽ dẫn ta đến trang web của người đó :)

      Xóa
  4. kiểu quảng bá đó hả :-SS

    Trả lờiXóa
    Trả lời
    1. Không phải. Cái này 2 bên hợp tác cùng có lợi. Mình add link người ta thì người ta add mình.

      Xóa
  5. àh ra là thế :D

    Mà cậu bỏ cái tắt đèn đi

    Tưởng j` hót ấn vô đen xì =))

    Trả lờiXóa
    Trả lời
    1. tắt đèn để khi xem phim hoặc nghe nhạc đó cậu :-t

      Xóa
  6. Mình ấn tắt đèn đen xì lun =))

    Chẳng thấy gì hết trơn nữa thì xem gì

    Này thì tắt đèn =))

    [img]http://i1210.photobucket.com/albums/cc417/dung1prohb/tatden.jpg[/img]

    Trả lờiXóa
    Trả lời
    1. Cậu xem video thì tắt đèn nó mới nổi video lên chứ xem "chữ" không thì tắt chi cho đen màn hình :D

      Cậu sử dụng trình duyệt google chrome xem trang sẽ hiển thị tốt nhất.

      Xóa
  7. Bên FF tớ có play nhưng vẫn đen @-)

    Đổi chro thì xem được

    Trả lờiXóa