Cách sử dụng jQuery Imagelens

Thảo luận trong 'Rao Vặt Miền Bắc' bắt đầu bởi springriver, 7/3/15.

  1. springriver

    springriver Thành Viên Mới

    Tham gia ngày:
    6/1/15
    Bài viết:
    64
    Đã được thích:
    0
    Điểm thành tích:
    6
    joomla minify js giới thiệu tới các bạn plugin imagelens cho phép bạn tùy biến kích thước của lens, màu sắc viền lens, chọn một ảnh khác để zoom (không cần load ảnh gốc ngay từ đầu).

    [​IMG]
    Cách sử dụng rất đơn giản, bạn vào đây để download file jquery.imageLens.js về:

    HTML:
    
    http://www.dailycoding.com/posts/imagelens__a_jquery_plugin_for_lens_effect_image_zooming.aspx
    
    Sau đó thêm vào site của bạn :

    HTML:
    
    <script src="jquery.imageLens.js" type="text/javascript"></script>
    
    ta có đoạn HTML như sau:

    HTML:
    
    <img id="img_01" src="king.png" width="384" height="240"/>
    
    Bạn nhớ thẻ img phải có 1 id, ta sẽ gọi id này ra để nó có hiệu ứng imagelens, để cho ảnh có hiệu ứng imagelens, ta có đoạn script sau:

    HTML:
    
    <script type="text/javascript">
     $(function () {
     $("#img_01").imageLens(); 
     }); 
     </script>
    
    Như các bạn thấy ta gán hiệu ứng vào id của image.

    Có các cách tùy chọn của imagelens như sau:

    Nếu bạn muốn ảnh thumbnai khác với ảnh được zoom, bạn viết lệnh

    HTML:
    
    $("#img_01").imageLens({ imageSrc: "sample01.jpg" });
    
    trong đó sample01.jpg là ảnh được zoom.

    Bạn cũng có thể thay đổi cỡ lens:

    HTML:
    
    $("#img_01").imageLens({ lensSize: 200 });
    
    Bạn có thể thay đổi màu viền của len bằng lệnh:

    HTML:
    
    $("#img_01").imageLens({ borderSize: 8, borderColor: "#06f" });
    
    Nếu bạn sử dụng trình duyệt từ IE8 trở xuống, lens sẽ có hình vuông thay vì hình tròn.
     
    Cảm ơn đã xem bài:

    Cách sử dụng jQuery Imagelens

    danh sách diễn đàn rao vặt gov chất lượng


Chủ để tương tự : Cách sử
Diễn đàn Tiêu đề Date
Rao Vặt Miền Bắc Hướng dẫn cách sử dụng máy đo huyết áp cơ Thứ hai lúc 4:49 PM
Rao Vặt Miền Bắc Cách phòng tránh bệnh sùi mào gà 14/5/18
Rao Vặt Miền Bắc Cách gìn giữ, sử dụng sàn gỗ ngoài trời 3/5/18
Rao Vặt Miền Bắc Xử lý sự cố tivi mất tiếng một cách nhanh chóng 3/5/18
Rao Vặt Miền Bắc Máy xay KG305 1.5 Lit, Cách sửa quạt điều hòa không quay và Máy nước nóng lạnh KG32N 23/4/18

Like và Share ủng hộ ITSEOVN