"Tạo hiệu ứng cho ảnh imageWarp với Jquery"

(Traidatmui.com) – Mình đã giới thiệu cho các bạn cách tạo lightbox cho ảnh, hôm nay mình sẽ giới thiệu cho các bạn một thủ thuật tao hiệu ứng cho ảnh nữa đó là hiệu ứng "Image warp". Hiệu ứng này sử dụng Jquery, hiệu ứng này nó sẽ làm cho hình ảnh của bạn tăng kích cở lên khi bạn click vào ảnh đó trong một khoảng thời gian ngắn, sau đó sẽ trả hình ảnh về kích cở ban đầu.

Các bước để thực hiện

1. Bạn hãy đăng nhập vào blogger
2. Vào bố cục chọn chỉnh sửa HTML
3. Chèn code bên dưới vào sau thẻ <head> hoặc trước thẻ </head>
<script type="text/javascript" src="http://data-traidatmui.appspot.com/scripts/jquery.min.js"></script>
<script type="text/javascript" src="http://data-traidatmui.appspot.com/scripts/hover_warp_img.js"></script>

<script type="text/javascript">

jQuery(document).ready(function($){
$('img.imagewarp').imageWarp()})
</script>

4. Để sử dụng hiệu ứng này thì bạn phải thêm vào thẻ "Image" một class="imagewarp" như bên dưới
<a href="http://nvdinh88.blogspot.com/"><img src="http://lh6.ggpht.com/_BTztXRwC9ik/S4tj4lnAcrI/AAAAAAAAANw/vwXqEQJYh-c/s640/2009_11_21%5E13_31_42.jpg" class="imagewarp" style="width:200px; height:150px;" border="0"/></a>

Thay link màu xanh thành link ảnh và đường dẫn của bạn
Chúc thành công

Xem khác cùng chủ đề

Bạn nhập từ: cungly Bạn nhập từ: lleu Bạn nhập từ: kkrong Bạn nhập từ: cuoilon Bạn nhập từ: roile Bạn nhập từ: hehehe Bạn nhập từ: byebye Bạn nhập từ: idontknow Bạn nhập từ: votay more »

Giải pháp bán hàng online Số 1 Việt Nam
Lên đầu trang Xuống cuối trang