html 怎么在图片加载前定义大小
日期：2014-05-16 浏览次数：20473 次
html 怎样在图片加载前定义大小
我朋友的一个网站，遇到了点小问题，就是网速快的时候没什么影响，网速很慢的情况下网页里面的图片会把网页撑的很大，然后过会才恢复正常，我看了觉得应该是onload的问题，就是不知道怎么改，网站如下：
http://www.xihuituteng.cn/
下面是涉及到的源码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<Script language="javascript">
var flag=false;
function DrawImage(ImgD,ImgWidth,ImgHeight){
var image=new Image();
image.src=ImgD.src;
if(image.width>0 && image.height>0){
flag=true;
if(image.width/image.height>= ImgWidth/ImgHeight){
if(image.width>ImgWidth){
ImgD.width=ImgWidth;
ImgD.height=(image.height*ImgWidth)/image.width;
}else{
ImgD.width=image.width;
ImgD.height=image.height;
}
ImgD.alt=image.width+"×"+image.height;
}
else{
if(image.height>ImgHeight){
ImgD.height=ImgHeight;
ImgD.width=(image.width*ImgHeight)/image.height;
}else{
ImgD.width=image.width;
ImgD.height=image.height;
}
ImgD.alt=image.width+"×"+image.height;
}
}
}
</Script>
<head>
</head>
<body>
<table width="100%" border="0" cellspacing="0" cellpadding="2">
<tr>
<td width="33.3333333333333%" align="center"><table width="150" border="0" cellpadding="0" cellspacing="3" bgcolor="#4A4B4C">
<tr>
<td height="152" align="center"><a href='Prodetails.asp?ID=154' target='_blank'><img src='Uploads/2009-4-8-10181.jpg' border='0' onload='javascript:DrawImage(this,144,152);'></a></td>
</tr>
</table>
</table>
</body>
</html>
------解决方案--------------------
把函数里的
var image=new Image();
image.src=ImgD.src;
函数下面的image直接用ImgD
------解决方案--------------------
开始就直接设置图片的width和height,<img width=** height=**
我朋友的一个网站，遇到了点小问题，就是网速快的时候没什么影响，网速很慢的情况下网页里面的图片会把网页撑的很大，然后过会才恢复正常，我看了觉得应该是onload的问题，就是不知道怎么改，网站如下：
http://www.xihuituteng.cn/
下面是涉及到的源码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<Script language="javascript">
var flag=false;
function DrawImage(ImgD,ImgWidth,ImgHeight){
var image=new Image();
image.src=ImgD.src;
if(image.width>0 && image.height>0){
flag=true;
if(image.width/image.height>= ImgWidth/ImgHeight){
if(image.width>ImgWidth){
ImgD.width=ImgWidth;
ImgD.height=(image.height*ImgWidth)/image.width;
}else{
ImgD.width=image.width;
ImgD.height=image.height;
}
ImgD.alt=image.width+"×"+image.height;
}
else{
if(image.height>ImgHeight){
ImgD.height=ImgHeight;
ImgD.width=(image.width*ImgHeight)/image.height;
}else{
ImgD.width=image.width;
ImgD.height=image.height;
}
ImgD.alt=image.width+"×"+image.height;
}
}
}
</Script>
<head>
</head>
<body>
<table width="100%" border="0" cellspacing="0" cellpadding="2">
<tr>
<td width="33.3333333333333%" align="center"><table width="150" border="0" cellpadding="0" cellspacing="3" bgcolor="#4A4B4C">
<tr>
<td height="152" align="center"><a href='Prodetails.asp?ID=154' target='_blank'><img src='Uploads/2009-4-8-10181.jpg' border='0' onload='javascript:DrawImage(this,144,152);'></a></td>
</tr>
</table>
</table>
</body>
</html>
------解决方案--------------------
把函数里的
var image=new Image();
image.src=ImgD.src;
函数下面的image直接用ImgD
------解决方案--------------------
开始就直接设置图片的width和height,<img width=** height=**
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
