.net Image控件图片缩放问题，有点急，求各位帮忙~

Image服务器控件的大小：500*600
A、B两张图   A的大小200*200  ，B的大小1000*1000想要的效果：
A显示的时候就只是200*200  并且在Image中水平、垂直均居中，
B显示的时候则自动等比例缩小  变为500*500  并且水平、垂直居中。。刚开始用的时候是在Image外面套了一个DIV ，Image不限制大小。A可以正常显示，不过垂直不会居中，B则直接把DIV给撑大了

解决方案 »

  1.   

    这个需要使用js实现
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <script runat="server">
      protected void Page_Load(object sender, EventArgs e)
      {
        Image1.Attributes.Add("onload", "resizeMe(this)");
      }
    </script>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
      <script type="text/javascript">
        function resizeMe(m) {
          var elem = m.parentNode;
          var w = window.getComputedStyle ? window.getComputedStyle(elem, null).getPropertyValue("width") : elem.currentStyle.width;
          var h = window.getComputedStyle ? window.getComputedStyle(elem, null).getPropertyValue("height") : elem.currentStyle.height;
          w = parseInt(w);
          h = parseInt(h);
         
          if (m.width > 500) m.width = 500;
          if (m.height > 500) m.height = 500;
          elem.style.paddingTop = (h - m.height) / 2 + "px";
          elem.style.height = (h - (h - m.height) / 2) + "px";
        }
      </script>
    </head>
    <body>
      <form id="form1" runat="server">
      <div style="width: 500px; height: 600px; background: green;text-align:center">
        <asp:Image ID="Image1" runat="server" ImageUrl="~/meng.gif" />
      </div>
      </form>
    </body>
    </html>
      

  2.   

      1.利用CSS来控制样式
      2.设置一个固定高宽  图片如果小于 则生成原图，如果大于固定高宽，则生成缩略图显示
      

  3.   

    谢了！~我把代码又改了下，，，能实现同比列缩放了。。
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            Image1.Attributes.Add("onload", "resizeMe(this)");
        }
    </script><html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">    <script type="text/javascript">
            function resizeMe(m) {
                var elem = m.parentNode;
                var w = window.getComputedStyle ? window.getComputedStyle(elem, null).getPropertyValue("width") : elem.currentStyle.width;
                var h = window.getComputedStyle ? window.getComputedStyle(elem, null).getPropertyValue("height") : elem.currentStyle.height;
                w = parseInt(w);
                h = parseInt(h);            var h = 600;
                var w = 500;
                var bili = m.width / m.height            if (m.width > w && m.height < h) m.width = bili * m.height;
                if (m.height > h && m.width < w) m.height = bili * m.width;
                if (m.width > m.height && m.width > w) { m.width = w; m.height = bili * w; }
                if (m.width < m.height && m.height > h) { m.height = h; m.width = bili * h; }
                elem.style.paddingTop = (h - m.height) / 2 + "px";
                elem.style.height = (h - (h - m.height) / 2) + "px";
            }
        </script></head>
    <body>
        <form id="form1" runat="server">
        <div style="width: 500px; height: 600px; background: green; text-align: center">
            <asp:Image ID="Image1" runat="server" ImageUrl="~/2.gif" />
        </div>
        </form>
    </body>
    </html>