联系站长 加入收藏 设为首页 繁體中文 RSS
  首页 | 生活百科 | 电脑网络 | 高手学堂 | 语录名言 | 读书文学 | 极品软件 | 奇趣图片 | 站长微博  
 您的位置: 精品百字节网 >> 电脑网络 >> 网络编程 >> 编程问题 >> 正文 当前没有通告!
   □  固定容器内等比例缩放图代码   3星级
固定容器内等比例缩放图代码
[ 作者:作者不详     来源:互连网     点击数:     更新时间:2007-09-07     文章录入:Admin
【字体:
[内容提要]
暂无简介

以下是引用片段:
<html>
<head>
<title>固定容器内等比例缩放图片</title>
<style type="text/css">
<!--
li{
display: table-cell;list-style:none;border:#333 solid 
1px;width:230;height:210px;padding:0px;margin:5px;text-align:center; vertical-align:middle;
}
-->
</style>
<script language="JavaScript">
<!--
//图片按比例缩放
var flag=false;
function DrawImage(ImgD){
var image=new Image();
var iwidth = 220;            //定义允许图片宽度,当宽度大于这个值时等比例缩小
var iheight = 200;            //定义允许图片高度,当宽度大于这个值时等比例缩小
image.src=ImgD.src;
if(image.width>0 && image.height>0){         //假如图片长宽都不为零
flag=true;
     if(image.height/image.width>= iheight/iwidth){       //通过正弦值判断图片缩放后是否偏高
      if(image.height>iheight){        //如果图片比设定的要高
       ImgD.height=iheight;
       ImgD.width=(image.width*iheight)/image.height;
      }else{
       ImgD.width=image.width; 
       ImgD.height=image.height;
      }
     ImgD.alt=image.width+"×"+image.height;
     }
     else{           //如果图片比例 小于 设定的比例
      if(image.width>iwidth){ 
       ImgD.width=iwidth;
       ImgD.height=(image.height*iwidth)/image.width; 
      }else{
       ImgD.width=image.width; 
       ImgD.height=image.height;
      }
     ImgD.alt=image.width+"×"+image.height;
     }
}

//调用:<img src="图片" onload="javascript:DrawImage(this)">
//-->
</script>
</head>
<body>
<li><img src="1.jpg" onload="javascript:DrawImage(this)"></li>
<li><img src="2.jpg" onload="javascript:DrawImage(this)"></li>
<li>文字测试也不少</li>
</body>
</html>

上一篇文章:获取从最小值MinNum到最大值MaxNum的随机数 下一篇文章:用Asp实现QQ在线查询功能
发表评论 □告诉好友 □打印此文 □收藏此页 □关闭窗口 □返回顶部
 最新热点文章
 精品医院类网站网址大收集
 如何删除windows 2003或xp系统隐藏的...
 DedeCms管理员后台登陆经常自动退出的...
 知道IP如何用dos命令查出电脑名称
 WORD出错老是要求以安全模式打开文件...
 如何设置首页不显示页眉页脚?
 如何利用inurl命令查询网站外链及栏目...
 
 最新推荐文章
 精品医院类网站网址大收集
 如何利用宽带路由器控制局域网内电脑上...
 CSS圆角代码的实现方法
 带停顿的单行文字滚动代码
 实用的新网站免费收录提交地址精选
 Left join , Right Join, Inner Join用...
 趣话淘宝网衍生的多种新型职业
 
 最新图文
  ◇  网友评论:(只显示最新5条。评论内容只代表网友观点,与本站立场无关!)
关于本站 | 免责申明 | 网站地图 | 联系站长 | 友情链接 | 与我同在
冀ICP备06032589号【虚拟化精英群虚拟化精英群续
  Copyright© 2006-2009 100byte.Com All Rights Reserved
网站声明:本网站是公益性质网站,部分内容来源于网络,如有侵犯您权利的地方,请与精品百字节站长联系,尽快修正.
Powered By CreateLive CMS 本站法律顾问:(冀港)武镇海律师
点击这里给我发消息