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

Tiện ích này bạn thấy ở phần Link hay của M21Love. Chỉ cần chỉnh sửa phần code một chút thì bạn sẽ có một Widget theo ý của mình.
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; và height: 250px; sửa 280px và 250px lại.
Nguồn Tanchau123.blogspot.com