难道我的方法不好使么?<BODY>
<span id=test></span>
</BODY><script>
var tmp = document.createElement("IMG");tmp.src = "http://www.chinatools.biz/bbs/uploadImages/2002112615222236009.jpg";tmp.height = 100 / (tmp.width/tmp.height);tmp.width = 100;tmp.onload = Function('test.insertAdjacentElement("AfterBegin",tmp);');
</script>--------------------------or 下面这个可能不好用------------------------------<BODY>
<span id=test></span>
</BODY>
<script>
var tmp = document.createElement("IMG");tmp.src = "http://www.chinatools.biz/bbs/uploadImages/2002112615222236009.jpg";tmp.height = 100 / (tmp.width/tmp.height);tmp.width = 100;test.insertAdjacentElement("AfterBegin",tmp);</script>

解决方案 »

  1.   

    因为src是从数据库力读出来的
      

  2.   

    这段代码是这样执行的:先执行HTML部分,显示原图片,然后执行SCRIPT部分,将图片缩小,这样就会出现图片载入的过程中显示原来大小的图片再按比例缩小的现象.
    解决方法:
    先将页面存到缓存中,在页面全部执行完后,再输出页面.我对JAVASCRIPT不熟,具体怎样办我就不说了!!!
      

  3.   

    jsp本身就是要缓存到内存中,但是javascript的代码如何缓存,还要请高手指教
      

  4.   

    javascript缓存一般是让图片放置在一个数组中,你可以试试将一个图片定义成变量,然后tmp.src = 该变量。
      

  5.   

    可是我的图片url是存放在数据库中的,无法和javascript进行交互
      

  6.   

    //另一办法,可行?<HTML>
    <HEAD>
    <META NAME="GENERATOR" Content="Microsoft Visual Studio 6.0">
    <TITLE></TITLE>
    <SCRIPT ID=clientEventHandlersJS LANGUAGE=javascript>
    <!--function i1_onload(othis) {
        //****************************
            //adjust picture size
            //you can use the zoom property of style also
        //**************************
        othis.style.visibility="";//set picture visible
        
    }//-->
    </SCRIPT>
    </HEAD>
    <BODY><P><IMG id=i1 alt="" 
    src="http://192.0.0.104:800/images/1.gif"  LANGUAGE=javascript onload="return i1_onload(this)" style="visibility:hidden"></P></BODY>
    </HTML>
      

  7.   

    <BODY BGCOLOR=white OnLoad="init();">
    <A HREF="#" onClick="javascript:zoom(0.5);"><FONT SIZE=3 COLOR=red FACE=arial>【50%】</FONT></A>
    <A HREF="#" onClick="javascript:zoom(1);"  ><FONT SIZE=3 COLOR=red FACE=arial>【100%】</FONT></A><OBJECT ID=DAControl
    STYLE="Position:absolute; width:0px;height:0px; top:50px; left:10px; "  
    CLASSID="CLSID:369303C2-D7AC-11d0-89D5-00A0C90833E6">
    </OBJECT> 
    <SCRIPT LANGUAGE="JavaScript" >
    <!--
    var lib;
    var realImg;
    var imgWidth = 0;
    var imgHeight = 0;
    var oldRate = 1;
    var imgObj = new Image();
    imgObj.src = "your image";function init(){
    imgWidth = imgObj.width;
    imgHeight = imgObj.height;

    DAControl.style.width = imgWidth;
    DAControl.style.height = imgHeight;

    lib = DAControl.Library;
    realImg = lib.ImportImage("your image");
    DAControl.Image = realImg;
    }
    function zoom(rate){
    var prm = parseFloat(rate);
    if ( oldRate == prm ) return;
    if ( oldRate != 1 ) {
    doZoom(1 / oldRate);
    }
    doZoom(prm);
    oldRate = prm;
    }
    function doZoom(rate){
    DAControl.Scale(rate, rate, 0);
    DAControl.style.width = imgWidth * rate;
    DAControl.style.height = imgHeight * rate;
    setWH();
    }
    function setWH(){
    imgWidth = DAControl.style.posWidth;
    imgHeight = DAControl.style.posHeight;
    }
    //-->
    </SCRIPT>
    </BODY>用这个可以,不过麻烦了点,我主要不是用这个来做缩放的,所以这个缩放的方法不是很好,不过可以解决楼主说的那个问题,将就一点吧!呵呵.
    里面的缩放比例自己改吧!over
      

  8.   

    楼上的方法,图片无法显示(已经填好了url),这个问题通过动态生成img元素已经解决了,但还存在问题,就是在不断刷新的情况下,有时候不能显示已经缩放好的图片,现在的代码如下:var tmp = document.createElement("IMG"); tmp.src = "...";
    var w=0, h=0, s=0.0, sy=4/3; h=tmp.height;
    w=tmp.width;
    s=w/h; if ((w>160) || (h>120)) {
    if (s<sy) {
    tmp.width=120*s;
    tmp.height=120;
    } else {
    tmp.width=160;
    tmp.height=160/s; }
    }
    tmp.onload = Function('tes.insertAdjacentElement("AfterBegin",tmp);');<span id=tes></span>
    而且当不能正常显示图片的时候,是可以看到脚本错误(是不是由于找不到tes所导致的呢)
      

  9.   

    to:godaga(godaga)
    上面的控件可不可以不通过比例,而直接通过赋予长宽来进行等比例的压缩
      

  10.   

    to 楼主:
       你的方法是正确的,然而浏览器读取图片是需要时间的,而且是异步的
    看看你的代码。        var tmp = document.createElement("IMG"); tmp.src = "...";
      //当你执行下面的代码的时候,并不能保证tmp.src已经被浏览器读取了,
      //浏览器并不会等tmp.src读到后才执行下面的代码 var w=0, h=0, s=0.0, sy=4/3; h=tmp.height;   //这个时候h的值应该为0
    w=tmp.width;
    s=w/h;解决的方法,可以用settimeout延时
    <SCRIPT LANGUAGE="JavaScript">
    function window::onload(){
    disp();
    }function disp() 
    {

    var img=new Image();
    img.src="http://y8y9.y365.com/pic/feng.jpg"

    setTimeout(function(){
    var w=0, h=0, s=0.0, sy=4/3;
    h=img.height;
    w=img.width;
    s=w/h;

    if ((w>200) || (h>150)) {
    if (s<sy) {
    w=150*s;
    h=150;
    } else {
    w=200;
    h=200/s;
    }
    }

    img.width=w;
    img.height=h;
    oSpan.appendChild(img);
    },1000);}
    </SCRIPT><span id="oSpan"></span>
      

  11.   

    延长一秒钟时间,让浏览器去读图片,才可能取得真实的图片大小。另:用<img>的onload事件解决这个问题不太好,因为onload是图片已经被加载完毕后才触发的,当然可以看到缩放过程
      

  12.   

    to locker这个我不太清楚,好像不能.
    那个的缩放方法好像就是按比例的!
    Scale(rate, rate, 0);
    中rate是倍数,大于1倍就放大,小于1倍就缩小!还有就是img.src这个加载图像时是要时间的,不要把img.src和img.width,imgheight顺序的放在一块代码里!
    我那个代码里就是这样,img.src放在init()外面了!