`

图片自动缩放

    博客分类:
  • js
阅读更多
 <img src='404.png' onload='AutoResizeImage(195,140,this)'  />

function AutoResizeImage(maxWidth,maxHeight,objImg){
	var img = new Image();
	img.src = objImg.src;
	var hRatio;
	var wRatio;
	var Ratio = 1;
	var w = img.width;
	var h = img.height;
	wRatio = maxWidth / w;
	hRatio = maxHeight / h;
	if (maxWidth ==0 && maxHeight==0){
	Ratio = 1;
	}else if (maxWidth==0){//
	if (hRatio<1) Ratio = hRatio;
	}else if (maxHeight==0){
	if (wRatio<1) Ratio = wRatio;
	}else if (wRatio<1 || hRatio<1){
	Ratio = (wRatio<=hRatio?wRatio:hRatio);
	}
	if (Ratio<1){
	w = w * Ratio;
	h = h * Ratio;
	}
	objImg.height = h;
	objImg.width = w;
}

 

分享到:
评论

相关推荐

    js图片自动缩放功能

    在网页中处理图片时,我们常常需要实现图片自动缩放的功能,以便适应不同设备的屏幕尺寸或者保持页面布局的美观。本文将详细介绍如何使用JavaScript实现图片自动缩放,并探讨相关技术点。 首先,图片自动缩放的核心...

    flash加载图片自动缩放居中

    在Flash开发中,"flash加载图片自动缩放居中"是一个常见的需求,它涉及到图片资源的动态加载、图像处理以及舞台布局等多个知识点。下面将详细解释这个过程。 首先,我们需要了解Flash中的`Loader`类,它是用于加载...

    javascript 图片自动缩放

    "javascript 图片自动缩放"是一个实用的技术,它可以帮助开发者确保图片在不同设备和分辨率下都能保持良好的显示效果。 首先,我们需要理解JavaScript的基本语法和DOM操作。JavaScript是一种脚本语言,常用于网页的...

    HTM5网页图片自动缩放

    图片自动缩放就是响应式设计的一部分,确保内容在任何设备上都能保持良好的可读性和视觉效果。 2. **图片元数据`&lt;meta&gt;`标签**: 使用`, initial-scale=1"&gt;`标签可以设置网页视口宽度为设备宽度,保证页面与设备...

    图片自动缩放autoCropImage.zip

    将图片自动缩放成指定大小,减少图片体积,从而加快下载速度,降低下载时间和成本。URI 模式 http://localhost/images/pic.jpg_50x100.jpg http://localhost/images/pic.jpg_50x100m2.jpg ...

    LabVIEW 拖动图片和自动缩放图片

    LabVIEW 拖动图片和自动缩放图片,NI公司自己都没有做出来过,非常的好。

    PB按比例缩放图片.rar_PB 缩放图片_PB图片框缩放_feet4lg_pb 图片_pb 自适应

    而“pb_自适应”则强调了代码的适应性,即程序能根据环境变化自动调整图片的展示。 在压缩包内的“PB按比例缩放图片”文件,很可能是包含源代码、示例图片或者其他资源的文件,用于演示如何在PB中实现这一功能。...

    css expression实现的图片自动缩放

    以下我们将详细探讨如何使用CSS Expression来实现图片自动缩放以及其工作原理。 首先,让我们回顾一下标题和描述中提到的需求。用户希望在显示大尺寸图片时避免出现滚动条,保持页面整洁,同时不裁剪图片,而是按照...

    网页图片自动按照比例缩放到指定大小

    在压缩包文件中,`图片自动缩放.html`很可能是一个包含上述代码示例的HTML文件,用于演示如何实现图片的自动缩放。`1.jpg`则是一个测试图片,当打开HTML文件时,可以看到图片按照预设的规则进行缩放。 总的来说,...

    利用jquery自动缩放图片

    可以在任何block元素内自动加载图片,注意要为此元素设定高度和宽度。 在元素上指定图片缩放的高和宽,data-img-size="200,200",再指定图片地址,data-img-url='201202290527DD55232D.jpg',js中调用imgAutoResizer...

    CSS expression控制图片自动缩放效果代码[兼容 IE,Firefox]

    1. CSS图片自动缩放问题:在网页设计中,图片自动缩放是一个常见需求,尤其是在响应式设计中更为重要。理想的做法是通过CSS实现图片的自动缩放,以便在不同分辨率和设备上保持图片的适当显示尺寸,而不必在...

    android layout自动缩放扩大图片

    总结起来,Android布局中的图片自动缩放主要依赖于dp单位、ImageView的scaleType属性、资源目录策略、动态计算缩放比例以及使用第三方库。合理的图片缩放策略能够提高应用的用户体验,避免因图片大小不合适带来的...

    flex 图片缩放

    当图片的原始宽高比例与Image组件设定的宽高比例不一致时,为了保持图像的原始比例,会自动填充或留出空白区域。例如,如果一个16:9比例的图片被放入一个4:3的Image组件中,图像将按比例缩放,使得宽度适应4,高度为...

    vb窗题背景自动缩放

    标题“vb窗体背景自动缩放”涉及到的是在Visual Basic(VB)编程环境中,如何让窗体的背景根据窗口尺寸的变化自动调整大小。这通常是为了实现用户界面的自适应性,确保无论窗口尺寸如何变化,背景图像都能适配并保持...

    css图片缩放 通过css控制图片自动缩放至css定义大小

    通过CSS控制图片自动缩放至指定大小,不仅可以保持页面布局的整洁和美观,还可以提升网站加载的速度。以下是一些关于CSS图片缩放的重要知识点。 首先,图片尺寸过大时,可能会导致页面布局变形,影响用户体验。使用...

    jquery自动缩放渐变全屏背景图片代码下载.zip

    在这个“jquery自动缩放渐变全屏背景图片代码下载.zip”压缩包中,我们关注的是一个利用jQuery实现的特殊效果,即全屏背景图片的自动缩放和渐变效果。这个功能通常用于提升网站的视觉吸引力,尤其是在设计现代、简洁...

    JS前端HTML5图片预览手势缩放

    title: "第一张图片的提示" },{ src: "2.jpg", w: 1024, h: 768, title: "第二张图片的提示" },{ src: "3.jpg", w: 800, h: 600, title: "第三张图片的提示" }]; openPhotoSwipe...

    JS+css 图片自动缩放自适应大小

    我加了css的限制: 代码如下:div img {}{max-width:600px;width:600px;width:[removed]document.body... ◎ 当图片大小大于600px,自动缩小为600px。在IE6中有效。 ◎ overflow:hidden; 超出的部分隐藏,避免控制图片大

Global site tag (gtag.js) - Google Analytics