又一个图片自动缩小的JS代码
<script language="JavaScript">
<!--
var flag=false;
function DrawImage(ImgD){
var image=new Image();
image.src=ImgD.src;
if(image.width>0 && image.height>0){
flag=true;
if(image.width/image.height>= 180/110){
if(image.width>180){
ImgD.width=180;
ImgD.height=(image.height*110)/image.width;
}else{
ImgD.width=image.width;
ImgD.height=image.height;
}
/*ImgD.alt="bigpic" */
}
else{
if(image.height>110){
ImgD.height=110;
ImgD.width=(image.width*110)/image.height;
}else{
ImgD.width=image.width;
ImgD.height=image.height;
}
/*ImgD.alt="bigpic" */
}
}
}
//-->
</script>
图片使用的地方:
<img src="图片" border=0 width="180" height="110" onload="JavaScriptrawImage(this);">
width="180" height="110" 注意这里最好限定,如果不限定加载图时会成原大,然后再缩小,这个过程如果图大了很难看的.这里是宽度和高度,在前面的JS里改,这里也作相应的改.
相关推荐
-
图片自动缩小 点击放大
如果不支持网页对话框就再新窗口打开 目的: 图片自动缩小 点击放大 输入: 无 返回: 无 function $(obj){ return document.getElementById(obj); } function ResizeImage(objImage,maxWidth) { try{ if(maxWidth>0){ var objImg = $(objImage); if(objImg.width()>maxWidth){ objImg.w
-
JS自动缩小超出大小的图片
复制代码 代码如下: <script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript"> jQuery.fn.LoadImage=function(scaling,width,height,loadpic){ if(loadpic==null)loadpic="../img/lo
-
js与自动伸缩图片 自动缩小图片的多浏览器兼容的方法总结 原创
最近做一个图片的自动缩小效果,发现一直用的js,竟然在firefox下无法正常啊,导致页面变形.所以自己写了个兼容性一般的代码,大家可以来讨论下原来我用的是从pjblog上的 复制代码 代码如下: //查找网页内宽度太大的图片进行缩放以及PNG纠正 function ReImgSize(){ for (i=0;i<document.images.length;i++) { if (document.all){ if (document.images[i].width>
-
图片自动缩小的js代码,用以防止图片撑破页面
JS代码(随便放哪里): <script language="JavaScript"> <!-- var flag=false; function DrawImage(ImgD){ var image=new Image(); image.src=http://www.jb51.net/htmldata/2006-01-08/ImgD.src; if(image.width>0 && image.height>0){ fl
-
又一个图片自动缩小的JS代码
<script language="JavaScript"> <!-- var flag=false; function DrawImage(ImgD){ var image=new Image(); image.src=ImgD.src; if(image.width>0 && image.height>0){ flag=true; if(image.width/image.height>= 180/110)
-
指定区域的图片自动按比例缩小的js代码(防止页面被图片撑破)
复制代码 代码如下: <div id=article><img height="800" alt="" width="1280" src="/down/js/images/12498880470.jpg" /></div><script type="text/javascript" >//缩放图片到合适大小function ResizeImages(){
-
jquery图片不完全按比例自动缩小的简单代码
复制代码 代码如下: jQuery(document).ready(function(){ /* 图片不完全按比例自动缩小*/ $(window).load(function(){$('#content div.thumbnail img').each(function(){ var x = 200; //填入目标图片宽度 var y = 140; //填入目标图片高度 var w=$(this).width(), h=$(this).height();//获取图片宽度.高度 if (w > x
-
js图片自动切换效果处理代码
复制代码 代码如下: <script language =javascript > var curIndex=0; //时间间隔 单位毫秒 var timeInterval=1000; var arr=new Array(); arr[0]="1.jpg"; arr[1]="2.jpg"; arr[2]="3.jpg"; arr[3]="4.jpg"; arr[4]="5.jpg"; arr[5
-
javascript 图片放大缩小功能实现代码
看JS源码: 复制代码 代码如下: // 放大缩小控制 var PhotoSize = { zoom: 0, // 缩放率 count: 0, // 缩放次数 cpu: 0, // 当前缩放倍数值 elem: "", // 图片节点 photoWidth: 0, // 图片初始宽度记录 photoHeight: 0, // 图片初始高度记录 init: function(){ this.elem = document.getElementById("focusphoto&qu
-
web网页按比例显示图片实现原理及js代码
在动态站点上经常需要上传自己的图片,而这些图片的大小是未知的,在显示成缩略图的时候必须进行按比例的缩放才能美观地显示.以最近做的golf网站(http://www.changligolfsales.com)做例子. 该网站需要上传高尔夫产品图片,并以缩略图显示在列表上,站点服务器支持Asp,但不支持aspjpeg之类的生成缩略图组件,所以将上传的图片直接显示成缩略图,就需要按比例缩放了,前提是要获取图片的长宽,第一个想到的方法是在上传的时候通过ADODB.STREAM对象读取图片的长宽信息保存在
-
Android实现图片自动切换功能(实例代码详解)
在Android中图片的自动切换不仅可以实现自动切换,而且还可以使用手动切换.而且一般在切换的时候,在图片下方还带有其他内容的切换,用来标记是第几个图片的切换. 这种效果在我们日常生活中很常见,例如某宝购物,一些商城都可以使用到,用户体验度极好,今天小编就通过实例代码给大家分享android 图片自动切换功能的实现. 实现效果如下: 具体的示例代码如下: 布局代码: <?xml version="1.0" encoding="utf-8"?> <S
随机推荐
- Java 对 Properties 文件的操作详解及简单实例
- CentOS 7下YUM 本地仓库的搭建详细步骤
- IOS中UIWebView的使用详解
- js实现飞入星星特效代码
- 模板引擎smarty工作原理以及使用示例
- Fleaphp常见函数功能与用法示例
- PHP的反射类ReflectionClass、ReflectionMethod使用实例
- Asp.net 在三层架构中事务的使用实例代码
- C# WindowsForm程序同时启动多个窗口类
- 自定义百度分享的分享按钮
- IIS解析json的配置方法汇总
- 举例说明如何为JavaScript的方法参数设置默认值
- 利用DWRCC突破天网防火墙(经验)(图)
- js实现复选框的全选和取消全选效果
- javascript中DOM复选框选择用法实例
- java微信公众号开发第一步 公众号接入和access_token管理
- C++动态数组类的封装实例
- C#中数据的传递以及ToolStripProgressBar
- javascript ES6中箭头函数注意细节小结
- Javascript 继承机制实例