亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

JS實(shí)現(xiàn)按比例縮放圖片的方法(附C#版代碼)

 更新時(shí)間:2015年12月08日 12:07:59   作者:仰天一笑  
這篇文章主要介紹了JS實(shí)現(xiàn)按比例縮放圖片的方法,結(jié)合實(shí)例形式較為詳細(xì)的分析了JavaScript實(shí)現(xiàn)等比例縮放圖片的原理與具體實(shí)現(xiàn)技巧,并附上C#版的圖片縮放代碼做對(duì)比參考,需要的朋友可以參考下

本文實(shí)例講述了JS實(shí)現(xiàn)按比例縮放圖片的方法。分享給大家供大家參考,具體如下:

js版本:

function resizeImage(obj, MaxW, MaxH)
{
 var imageObject = obj;
 var state = imageObject.readyState;
 if(state!='complete') 
 {
  setTimeout("resizeImage("+imageObject+","+MaxW+","+MaxH+")",50);
  return;
 }
 var oldImage = new Image();
 oldImage.src = imageObject.src;
 var dW = oldImage.width; 
 var dH = oldImage.height;
 if(dW>MaxW || dH>MaxH) 
 {
  a = dW/MaxW; b = dH/MaxH;
  if( b>a ) a = b;
  dW = dW/a; dH = dH/a;
 }
 if(dW > 0 && dH > 0) 
 {
  imageObject.width = dW;
  imageObject.height = dH;
 }
}

使用很簡(jiǎn)單:<img src="../pic.jpg" onload='resizeImage(this,60,90)> 就OK了;

注:等比例放縮的時(shí)候會(huì)出現(xiàn)抖動(dòng)的情況,處理方法很簡(jiǎn)單,你在img的屬性先設(shè)置它的widht和height,這樣的話加載的時(shí)候絕對(duì)不會(huì)超過這個(gè)尺寸,等你js運(yùn)行好之后就會(huì)調(diào)到你所規(guī)定的比例,絕對(duì)不會(huì)以下?lián)蔚胶艽蟆?/p>

同時(shí)也附上C#版本的

/// <summary>
/// 按比例縮放圖片
/// </summary>
/// <param name="imgUrl">圖片的路徑</param>
/// <param name="imgHeight">圖片的高度</param>
/// <param name="imgWidth">圖片的寬度</param>
/// <returns></returns>
public static string GetImageSize(string imgUrl,int imgHeight,int imgWidth)
{
 string fileName = System.Web.HttpContext.Current.Server.MapPath(imgUrl);
 string strResult = string.Empty;
 if(System.IO.File.Exists(fileName) && imgHeight != 0 && imgWidth != 0)
 {
  decimal desWidth;decimal desHeight;//目標(biāo)寬高
  System.Drawing.Image objImage = System.Drawing.Image.FromFile(fileName);
  decimal radioAct = (decimal)objImage.Width/(decimal)objImage.Height;//原始圖片的寬高比
  decimal radioLoc = (decimal)imgWidth/(decimal)imgHeight;//圖片位的寬高比
  if(radioAct > radioLoc)//原始圖片比圖片位寬
  {  
   decimal dcmZoom = (decimal)imgWidth/(decimal)objImage.Width;
   desHeight = objImage.Height*dcmZoom;
   desWidth = imgWidth;
  }
  else
  {
   decimal dcmZoom = (decimal)imgHeight/(decimal)objImage.Height;
   desWidth = objImage.Width*dcmZoom;
   desHeight = imgHeight;
  }
  objImage.Dispose(); //釋放資源
  strResult = "width=\"" + Convert.ToString((int)desWidth) + "\" height=\""
   + Convert.ToString((int)desHeight) + "\" ";
 }
 return strResult;
}

希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。

相關(guān)文章

  • JavaScript中偽協(xié)議 javascript:使用探討

    JavaScript中偽協(xié)議 javascript:使用探討

    javascript:這個(gè)特殊的協(xié)議類型聲明了URL的主體是任意的javascript代碼,它由javascript的解釋器運(yùn)行
    2014-07-07
  • js實(shí)現(xiàn)無縫輪播圖插件封裝

    js實(shí)現(xiàn)無縫輪播圖插件封裝

    這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)無縫輪播圖插件封裝,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
    2020-07-07
  • JS圖片懶加載技術(shù)實(shí)現(xiàn)過程解析

    JS圖片懶加載技術(shù)實(shí)現(xiàn)過程解析

    這篇文章主要介紹了JS圖片懶加載技術(shù)實(shí)現(xiàn)過程解析,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下
    2020-07-07
  • JS+CSS實(shí)現(xiàn)模仿瀏覽器網(wǎng)頁字符查找功能的方法

    JS+CSS實(shí)現(xiàn)模仿瀏覽器網(wǎng)頁字符查找功能的方法

    這篇文章主要介紹了JS+CSS實(shí)現(xiàn)模仿瀏覽器網(wǎng)頁字符查找功能的方法,實(shí)例分析了javascript實(shí)現(xiàn)查找功能的樣式及相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
    2015-02-02
  • JS定時(shí)器實(shí)例詳細(xì)分析

    JS定時(shí)器實(shí)例詳細(xì)分析

    在javascritp中,有兩個(gè)關(guān)于定時(shí)器的專用函數(shù),下面講解一下兩個(gè)定時(shí)器,有需要的朋友可以參考一下
    2013-10-10
  • 原生js實(shí)現(xiàn)新聞列表展開/收起全文功能

    原生js實(shí)現(xiàn)新聞列表展開/收起全文功能

    本文主要介紹了原生js實(shí)現(xiàn)新聞列表展開/收起全文功能的知識(shí)要點(diǎn)、注意事項(xiàng)以及完整代碼。具有一定的參考價(jià)值,下面跟著小編一起來看下吧
    2017-01-01
  • js仿小米官網(wǎng)圖片輪播特效

    js仿小米官網(wǎng)圖片輪播特效

    這篇文章主要為大家詳細(xì)介紹了js仿小米官網(wǎng)圖片輪播特效,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
    2016-09-09
  • JavaScript中Null與Undefined的區(qū)別解析

    JavaScript中Null與Undefined的區(qū)別解析

    這篇文章主要介紹了JavaScript中Null與Undefined的區(qū)別解析,本文給出了多個(gè)代碼實(shí)例講解它們之間的區(qū)別,需要的朋友可以參考下
    2015-06-06
  • js?scrollTop如何到達(dá)指定位置

    js?scrollTop如何到達(dá)指定位置

    很早之前就想分享這篇心得,幸之今天能在這里完成,好了,話不多說,進(jìn)入正題。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
    2022-10-10
  • JS判斷一個(gè)數(shù)是否是水仙花數(shù)

    JS判斷一個(gè)數(shù)是否是水仙花數(shù)

    水仙花數(shù)是指一個(gè) n 位數(shù) ( n≥3 ),它的每個(gè)位上的數(shù)字的 n 次冪之和等于它本身。下面通過本文給大家分享JS判斷一個(gè)數(shù)是否是水仙花數(shù),需要的朋友參考下吧
    2017-06-06

最新評(píng)論