jQuery在頁面加載時動態(tài)修改圖片尺寸的方法
更新時間：2015年03月20日 10:55:27 作者：令狐不聰
這篇文章主要介紹了jQuery在頁面加載時動態(tài)修改圖片尺寸的方法,實例分析了jQuery操作圖片的技巧,非常具有實用價值,需要的朋友可以參考下
本文實例講述了jQuery在頁面加載時動態(tài)修改圖片尺寸的方法。分享給大家供大家參考。具體如下：
$(window).bind("load", function() {
// IMAGE RESIZE
$('#product_cat_list img').each(function() {
var maxWidth = 120;
var maxHeight = 120;
var ratio = 0;
var width = $(this).width();
var height = $(this).height();
if(width > maxWidth){
ratio = maxWidth / width;
$(this).css("width", maxWidth);
$(this).css("height", height * ratio);
height = height * ratio;
}
var width = $(this).width();
var height = $(this).height();
if(height > maxHeight){
ratio = maxHeight / height;
$(this).css("height", maxHeight);
$(this).css("width", width * ratio);
width = width * ratio;
}
});
//$("#contentpage img").show();
// IMAGE RESIZE
});
希望本文所述對大家的jQuery程序設(shè)計有所幫助。
您可能感興趣的文章:
相關(guān)文章
這篇文章主要介紹了使用struts2+jquery如何驗證注冊用戶是否存在,需要的朋友可以參考下2014-04-04
使用Jquery來實現(xiàn)可以輸入值的下拉選單 雛型
最近案子中，需要使用下拉選單，但問題是，里面選項都會有各 其他：，然後 可以 讓 user 在輸入2011-12-12
這篇文章主要介紹了jquery實現(xiàn)翻動fadeIn顯示的方法,實例分析了jQuery中fadeIn方法的使用技巧,需要的朋友可以參考下2015-03-03
原生Aajax 和jQuery Ajax 寫法個人總結(jié)
AJAX:即“Asynchronous Javascript And XML”（異步JavaScript和XML），是指一種創(chuàng)建交互式網(wǎng)頁應(yīng)用的網(wǎng)頁開發(fā)技術(shù)。本文重點給大家介紹原生Aajax 和jQuery Ajax 個人總結(jié)，一起看看吧2017-03-03
這篇文章主要介紹了jquery實現(xiàn)相冊一下滑動兩次的方法,是非常實用的圖片特效技巧,需要的朋友可以參考下2015-02-02
jquery滾動到頂部底部是一款簡單的滾動到頂部底部控制。是一個很實用的功能，他能幫助新手和高級開發(fā)者們創(chuàng)造美好的用戶體驗。這里推薦給大家，有需要的小伙伴可以參考下。2015-04-04
jQuery 是最流行和使用最廣泛的 JavaScript 框架，它簡化了HTML文檔遍歷，事件處理，動畫以及Ajax交互，幫助Web開發(fā)人員更快速的實現(xiàn)各種精美的界面效果2012-03-03
這個是select版的，若想美化某些樣式是不支持得，大家可以使用div模擬版，下面小編給大家介紹下jQuery雙向列表選擇器select版，感興趣的朋友一起看看吧2016-11-11
jquery實現(xiàn)在光標(biāo)位置插入內(nèi)容的方法
這篇文章主要介紹了jquery實現(xiàn)在光標(biāo)位置插入內(nèi)容的方法,涉及jQuery功能的擴展技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-02-02
這篇文章主要介紹了jQuery獲取URL請求參數(shù)的方法,涉及jquery針對URL的獲取與字符串的操作技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-07-07