建站
咨詢
售后
建站咨詢
新聞中心
這里有您想知道的互聯(lián)網營銷解決方案
jQuery中怎么實現等比例縮放大圖片-創(chuàng)新互聯(lián)
jQuery中怎么實現等比例縮放大圖片，很多新手對此不是很清楚，為了幫助大家解決這個難題，下面小編將為大家詳細講解，有這方面需求的人可以來學習下，希望你能有所收獲。
1.已知圖片尺寸
當頁面加載的圖片中含有屬性width和height值，則可以使用幾句簡單的jQuery代碼實現等比例縮放。
$(function(){
var w = $("#demo1").width();//容器寬度
$("#demo1 img").each(function(){//如果有很多圖片，我們可以使用each()遍歷
var img_w = $(this).width();//圖片寬度
var img_h = $(this).height();//圖片高度
if(img_w>w){//如果圖片寬度超出容器寬度--要撐破了
var height = (w*img_h)/img_w; //高度等比縮放
$(this).css({"width":w,"height":height});//設置縮放后的寬度和高度
}
});
});
2.未知圖片尺寸
當頁面加載的圖片尺寸未知的情況下，上述代碼則不能進行有效的縮放，這種情況多出現在采集的外部鏈接圖片。
調用autoIMG插件方法相當簡單：
$(function(){
$("#demo2").autoIMG();
});
看完上述內容是否對您有幫助呢？如果還想對相關知識有進一步的了解或閱讀更多相關文章，請關注創(chuàng)新互聯(lián)行業(yè)資訊頻道，感謝您對創(chuàng)新互聯(lián)網站建設公司，的支持。
分享題目：jQuery中怎么實現等比例縮放大圖片-創(chuàng)新互聯(lián)
文章位置：http://www.dlmjj.cn/article/hpipp.html
