`
weiweichen1985
  • 浏览: 140997 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

控制图片大小

阅读更多
/*
    控制图片大小
	ImgD:类型为img的input元素对象,一般传入this即可
	maxwidth:待显示的图片的最大宽度
	maxheight:待显示的图片的最大高度
	调用示例:
	<input type="img" onload="DrawImage(this,80,80)"/>
*/
var flag=false;
function DrawImage(ImgD,maxwidth,maxheight){  
   var image=new Image(); 
   image.src=ImgD.src;  
   if(image.width>0 && image.height>0){  
    flag=true;  
    if(image.width/image.height>=maxwidth/maxheight){  
     if(image.width>maxwidth){    
     ImgD.width=maxwidth;  
     ImgD.height=(image.height*maxwidth)/image.width;  
     }else{  
     ImgD.width=image.width;    
     ImgD.height=image.height;  
     }  
     }  
    else{  
     if(image.height>maxheight){    
     ImgD.height=maxheight;  
     ImgD.width=(image.width*maxheight)/image.height;       
     }else{  
     ImgD.width=image.width;    
     ImgD.height=image.height;  
     }  
     }  
    }  
   }   
分享到:
评论

相关推荐

    JQuery控制图片大小代码

    下面将详细介绍jQuery控制图片大小的基本方法和相关知识点。 1. **获取图片元素** 在jQuery中,我们首先需要获取到图片元素。通常,我们可以使用`$("#imgId")`来选择具有特定ID的图片,或者`$(".imgClass")`来选择...

    js控制图片大小

    js控制图片大小,并验证图片类型,兼容各浏览器,测试可用

    jquery幻灯片插件图片层叠加按钮控制图片大小缩放切换

    本主题聚焦于一个特定的jQuery插件——使用按钮控制图片大小缩放和切换功能。这个插件允许用户通过叠加在图片上的控制按钮来调整图片的大小,并进行平滑的幻灯片切换。 首先,让我们了解一下jQuery的基础。jQuery是...

    jQuery插件 拖拽和鼠标滚轮控制图片大小

    本文将详细探讨如何利用jQuery插件实现拖拽和鼠标滚轮控制图片大小的功能,这对于创建交互式网页体验至关重要。 首先,我们要理解jQuery中的拖拽功能。拖拽通常用于创建可移动的元素,例如在网页上拖动一个图片或...

    程序控制图片大小

    在IT行业中,处理图片是一项常见的任务,特别是在网页开发、数据可视化...以上就是使用Java程序控制图片大小和缩略比例的基本流程和关键知识点。通过熟练掌握这些技巧,你可以轻松地对图片进行各种调整,满足项目需求。

    java图片上传、控制大小、宽度高度和图片裁剪并保存

    控制图片大小通常涉及到图片的缩放。Java提供了多种库来实现这一功能,如Apache Commons Imaging (以前称为Sanselan) 或 Java Advanced Imaging (JAI) API。使用这些库,可以通过读取图片原始数据,调整其宽度和...

    JS控制图片大小(等比例缩放)

    JS控制图片大小(等比例缩放)

    js特效脚本含源码和说明JQ控制图片大小代码

    js特效脚本含源码和说明JQ控制图片大小代码本资源系百度网盘分享地址

    python批量截取视频某一帧图片可控制图片大小

    为了控制图片的大小,可以使用PIL(Python Imaging Library)或其分支Pillow库。通过`Image`对象的`resize()`方法,我们可以调整截取到的帧图片的尺寸,以满足用户的自定义需求。 至于文件操作,Python内置的`os`库...

    js用拖动滑块来控制图片大小的方法

    ### JavaScript 控制图片大小的拖动滑块技术 #### 1. 概述 在Web页面中,实现图片大小的动态调整是一个常见需求。传统上,用户可能需要点击按钮或在选项中选择,然后页面重新加载或显示新大小的图片。然而,使用...

    用css来控制图片大小显示的实现方法与代码

    用CSS控制图片大小显示的实现方法与代码 在网页设计中,图片大小的控制是非常重要的一方面。因为图片的大小不仅影响网页的布局,也影响用户的浏览体验。如果图片太大,可能会破坏网页的整体布局,影响用户的浏览...

    类似QQ日志的编辑器,控制图片大小,源码,asp.net

    标题和描述中提到的是一个基于ASP.NET开发的编辑器,它的功能类似于QQ日志编辑器,具备图片大小控制的功能。这意味着这个编辑器允许用户在发布内容时上传图片,并能对这些图片的尺寸进行调整,以适应不同的展示需求...

    labview图像读取 自适应图片大小.vi

    labview图像读取 自适应图片大小.vi

    CSS控制图片大小-适应宽度

    CSS(层叠样式表)是控制网页内容显示样式的一种语言,其中就包括控制图片大小的方法。在CSS中控制图片大小,特别是使其适应容器宽度,是一个常见的需求。以往,一些开发者会使用JavaScript(简称JS)来动态地调整...

    关于css控制图片大小不变形的实现思路

    在处理Web页面中的图片元素时,常常会遇到需要控制图片大小以适应页面布局的需求。在使用CSS控制图片大小的过程中,保持图片不失真的问题成为了前端开发者必须关注的要点。图片不失真即意味着在调整图片尺寸的过程中...

    Android实现通过手势控制图片大小缩放的方法

    在Android开发中,实现通过手势控制图片大小缩放的功能,主要涉及到手势识别和图像处理两个核心技术。以下将详细讲解这两个方面以及如何结合它们来实现上述功能。 首先,我们需要理解Android中处理手势触摸事件的...

    js 控制图片大小核心讲解

    首先,要控制图片大小,最直接的方法是通过HTML元素的属性进行调整。例如,通过设置`&lt;img&gt;`标签的`width`和`height`属性来改变图片尺寸。然而这种方法的局限性在于,它仅仅是按照设定的尺寸比例来拉伸或压缩图片,而...

    css+js完美控制图片大小

    ### CSS+JS完美控制图片大小 #### 知识点概述 在网页设计中,图片的显示效果直接影响到页面的整体美观度。为了使图片能够在不同尺寸的屏幕或容器中良好展示,通常需要对图片进行响应式处理。通过CSS(层叠样式表)...

Global site tag (gtag.js) - Google Analytics