Hiệu ứng Link Nudging với Jquery cho blogger.

Hiệu ứng thụt đầu dòng cho link khi dê chuột vào link nào đó. Với plugin này blog của bạn sẽ hấp dẫn hơn khi khách truy cập blog của bạn di chuột lên một link bất kỳ trên blog. Sau đây namkna đưa ra hai loại. đó là cho các liên kết bạn muốn và cho các nhãn blogger cộng với tất cả liên kết trong blog.

Thêm liên kết nhảy sang đẹp mắt khi di chuột đến nhìn hấp dẫn hơn cho khách truy cập blog của bạn. 

Cách 1: Cho liên kết được thiết lập.

Cách tiến hành:
1- Đăng nhập (login) vào Blog

2- Vào Mẫu (Template) 
3- Chọn Chỉnh sử HTML (Edit HTML) => Tiếp tục (Proceed) => Xem video:

4- Thêm đoạn code bên dưới vào trước thẻ </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'></script> <script type='text/javascript'> var dur = 400; // Duration Of Animation in Milli Seconds jQuery(document).ready(function($) { $('a.linknudge').hover(function() { $(this).animate({ paddingLeft: '25px' }, dur); }, function() { $(this).animate({ paddingLeft: 0 }, dur); }); }); // end of Jquery Script </script>

5- Lưu mẫu lại. 

6- Để sử dụng bạn dùng đoạn code sau:

<a class='linknudge' href='http://www.vietcons.info'>Thủ Thuật</a>

Đoạn mã trên dành cho các liên kết Tuỳ chỉnh, tạo hiệu ứng bằng cách thêm vào một lớp class của 'linknudge'

Cách 2: Cho tất cả các link và label trong blog.

Nếu muốn áp dụng cho nhãn (label) và tất cả các link trong blog thì bạn thêm đoạn code bên dưới vào trước thẻ </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js' type='text/javascript'> </script> <script type='text/javascript'> var dur = 400; // Thời gian hiệu ứng thụt vào $(document).ready(function() { $('a.linknudge, .Label ul li a').hover(function() { $(this).animate({ paddingLeft: '25px' }, dur); }, function() { $(this).animate({ paddingLeft: 0 }, dur); }); }); // end of Jquery Script </script>

- Lưu mẫu lại và kiểm tra nha.