首页 新闻 会员 周边 捐助

JavaScript图像缩放问题

0
悬赏园豆:20 [已关闭问题] 关闭于 2010-12-22 16:59

我是菜鸟,初学Javascript

一下是一个图片缩放的程序。

jQuery.fn.loadthumb = function(options) { options = $.extend({ src : "", imgId : "", parentId : "" },options); var _self = this; _self.hide(); var img = new Image(); $(img).load(function(){ imgDem = {}; imgDem.w = img.width; imgDem.h = img.height; imgDem = $.imgResize({"w": $("#"+options.parentId).width() ,"h": $("#"+options.parentId).height()},{"w":imgDem.w,"h":imgDem.h}); var imgMargins = $.imgCenter({"w": $("#"+options.parentId).width() ,"h": $("#"+options.parentId).height()},{"w":imgDem.w,"h":imgDem.h}); $("#"+options.imgId).css({width:imgDem.w,height:imgDem.h,marginLeft:imgMargins.l,marginTop:imgMargins.t}); _self.attr("src", options.src); _self.fadeIn("slow"); }).attr("src", options.src); //.atte("src",options.src)要放在load后面, return _self; } //重置图片宽度,高度插件 ( parentDem是父元素,imgDem是图片 ) jQuery.imgResize = function(parentDem,imgDem){ if(imgDem.w>0 && imgDem.h>0){ var rate = (parentDem.w/imgDem.w < parentDem.h/imgDem.h)?parentDem.w/imgDem.w:parentDem.h/imgDem.h; //如果 指定高度/图片高度 小于 指定宽度/图片宽度 , 那么,我们的比例数 取 指定高度/图片高度。 //如果 指定高度/图片高度 大于 指定宽度/图片宽度 , 那么,我们的比例数 取 指定宽度/图片宽度。 if(rate <= 1){ imgDem.w = imgDem.w*rate; //图片新的宽度 = 宽度 * 比例数 imgDem.h = imgDem.h*rate; }else{// 如果比例数大于1,则新的宽度等于以前的宽度。 imgDem.w = imgDem.w; imgDem.h = imgDem.h; } } return imgDem; } //使图片在父元素内水平,垂直居中,( parentDem是父元素,imgDem是图片 ) jQuery.imgCenter = function(parentDem,imgDem){ var left = (parentDem.w - imgDem.w)*0.5; var top = (parentDem.h - imgDem.h)*0.5; return { "l": left , "t": top}; }

 

function showImg(src) {var $img = $("#portrait");$img.loadthumb({"src": src ,"imgId":"portrait","parentId":"PortraitBox"});}

 

我的调用方式:

<div id="PortraitBox" style="width:240px; height:378px; background:#cccccc; overflow:hidden">      <img src="/themes/translucence/images/Jnvu.png" id="portrait" alt=""  onload="showImg('/themes/translucence/images/Jnvu.png)';"/>   </div>

 

以上代码没有效果

我想,首先使之有效,其次将js代码改成一个showImg(newwidth, newheight); 的形式。或者是showImg(imgID)的形式

星云外的主页 星云外 | 菜鸟二级 | 园豆:210
提问于:2010-10-28 12:25
< >
分享
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册