Chủ nhật, ngày 4 tháng 12 năm 2016

jQuery – Các đoạn mã (snippet) hữu ích

Ngày đăng: 2/4/2012, 8:21:46PM | Lượt xem: 4,652
Hot!

Bài viết này dùng để tổng hợp các đoạn mã nhỏ (snippet) mà tôi sưu tầm và chỉnh sửa lại để tiện cho việc tham khảo và…copy paste. Một số đoạn mã sử dụng phương pháp tạo plugin cho jQuery, đây là kĩ thuật rất hữu ích mà jQuery cung cấp giúp bạn có thể chia sẻ, tái sử dụng và giúp cho mã nguồn được rõ ràng.

jQuery_logoBài viết này dùng để tổng hợp các đoạn mã nhỏ (snippet) mà tôi sưu tầm và chỉnh sửa lại để tiện cho việc tham khảo và…copy paste. Một số đoạn mã sử dụng phương pháp tạo plugin cho jQuery, đây là kĩ thuật rất hữu ích mà jQuery cung cấp giúp bạn có thể chia sẻ, tái sử dụng và giúp cho mã nguồn được rõ ràng.

1. Nạp jQuery phiên bản mới nhất

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(function(){
// jQuery Code Here
});
</script>

2. Vô hiệu hóa menu ngữ cảnh khi nhấn chuột phải

$(document).bind('contextmenu',<strong>function</strong>(e){ <strong>return</strong> <strong>false</strong>; });

3. Chỉnh tọa độ thành phần vào giữa màn hình

jQuery.fn.center = function () {
    this.css('position','absolute');
    this.css('top', ( $(window).height() - this.height() ) / 2 +$(window).scrollTop() + 'px');
    this.css('left', ( $(window).width() - this.width() ) / 2 + $(window).scrollLeft() + 'px');return this;}
// Usage $("#first").center();

4. Tải trước các hình ảnh

jQuery.preloadImages = function() { for(var i = 0; i').attr('src', arguments[i]); } };
// Usage $.preloadImages('image1.gif', '/path/to/image2.png', 'some/image3.jpg');

5. Hiệu ứng cuộn trang đến một thành phần nào đó

jQuery.fn.autoscroll = function() {
		alert($(this).html());
  $('html,body').animate(
    {scrollTop: $(this).offset().top},
    500
  );
}

// Usage: $("#myElement").autoscroll();

Nếu bạn có đoạn mã nào muốn chia sẻ, xin hãy để lại comment, tôi sẽ chọn lọc và thêm vào bài viết.

 Chia sẻ qua: 
Hot!
Ý kiến bạn đọc

These items will be permanently deleted and cannot be recovered. Are you sure?

Gallery

image

Maecenas viverra rutrum pulvinar

Maecenas viverra rutrum pulvinar! Aenean vehicula nulla sit amet metus aliquam et malesuada risus aliquet. Vestibulum rhoncus, dolor sit amet venenatis porta, metus purus sagittis nisl, sodales volutpat elit lorem…

Read more

Text Links

Thiết kế logo chuyên nghiệp Insky
DAFABET
W88 w88b.com/dang-ky-tai-khoan-w88
W88
Copyright © 2011 - 2012 vietshare.vn by phamkhuong102@gmail.com doanhkisi2315@gmail.com. All rights reserved.