DataList显示图片变形要怎么解决

Question

DataList显示图片变形要怎么解决,如何缩放DataList里面的图片

Answer 1

你设置其datalist中显示图片的样式应该就可以了.
通过JS来实现等比缩放,你可以参考
希望可以帮到楼主
function resizeimg(ImgD,iwidth,iheight) { 
     var image=new Image(); 
     image.src=ImgD.src; 
     if(image.width>0 && image.height>0){ 
        if(image.width/image.height>= iwidth/iheight){ 
           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; 
        } 
        else{ 
                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; 
            } 
　　　　　ImgD.style.cursor= "pointer"; //改变鼠标指针 
　　　　　ImgD.onclick = function() { window.open(this.src);} //点击打开大图片 
　　　　if (navigator.userAgent.toLowerCase().indexOf("ie") > -1) { //判断浏览器，如果是IE 
　　　　　　ImgD.title = "请使用鼠标滚轮缩放图片，点击图片可在新窗口打开"; 
　　　　　　ImgD.onmousewheel = function img_zoom() //滚轮缩放 
　　　　　 { 
　　　　　　　　　　var zoom = parseInt(this.style.zoom, 10) || 100; 
　　　　　　　　　　zoom += event.wheelDelta / 12; 
　　　　　　　　　　if (zoom> 0)　this.style.zoom = zoom + "%"; 
　　　　　　　　　　return false; 
　　　　　 } 
　　　  } else { //如果不是IE 
　　　　　　　     ImgD.title = "点击图片可在新窗口打开"; 
　　　　　　   } 
    } 
}
<img name="" src="" onload="javascript:resizeimg(this,100,200)">

Answer 2

DataList里面有个模板，模板里有图片，图片是从数据库中读取的

Answer 3

            <ItemTemplate>
                <table border="0" cellpadding="0" cellspacing="0" style="position: relative" width="230">
                    <tr>
                        <td align="center" height="188" nowrap="" style="width: 230px" valign="middle">
                            <table border="0" cellpadding="0" cellspacing="0" width="168">
                                <tr>
                                    <td align="center" height="188" nowrap="" style="background-image: url(images/photo_0.jpg)"
                                        valign="middle">
                                        <table border="0" cellpadding="0" cellspacing="0" height="149" width="140">
                                            <tr>
                                                <td style="height: 149px">
                                                    <asp:ImageButton ID="ImageButton1" runat="server" Height="142px" ImageUrl='<%#DataBinder.Eval(Container.DataItem,"TypeUrl") %>' PostBackUrl='<%#"~/photos/meb_m2.aspx?TypeID="+DataBinder.Eval(Container.DataItem,"TypeID") %>'
                                                        Style="left: 4px; position: relative" Width="102px" />&nbsp;<br />
                                                    <%#DataBinder.Eval(Container.DataItem,"TypeName") %>
                                                    (<%#DataBinder.Eval(Container.DataItem, "TypeCount")%>)张</td>
                                            </tr>
                                        </table>
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>
                    <tr>
                        <td height="12" nowrap="" style="width: 230px">
                            &nbsp;
                        </td>
                    </tr>
                    <tr>
                        <td align="center" nowrap="" style="width: 230px; height: 24px">
                            <asp:ImageButton ID="imgbtnUpdate" runat="server" ImageUrl="~/photos/images/ph_re_r1_c1.gif"
                                PostBackUrl='<%#"~/photos/news_ph_ch.aspx?TypeID="+DataBinder.Eval(Container.DataItem,"TypeID") %>'
                                Style="position: relative" />
                            &nbsp; &nbsp;<asp:ImageButton ID="imgbtnDel" runat="server" ImageUrl="~/photos/images/ph_re_r1_c4.gif"
                                PostBackUrl='<%#"~/photos/del.aspx?TypeID="+DataBinder.Eval(Container.DataItem,"TypeID") %>'
                                Style="position: relative" /></td>
                    </tr>
                    <tr>
                        <td align="center" style="width: 230px; height: 24px" valign="middle">
                            日期: &nbsp;<%#DataBinder.Eval(Container.DataItem, "TypeDate")%></td>
                    </tr>
                </table>
            </ItemTemplate>
        </asp:DataList>

Answer 4

<asp:ImageButton   ID="ImageButton1"   runat="server"   Height="142px"   ImageUrl=' <%#DataBinder.Eval(Container.DataItem,"TypeUrl")   %> '   PostBackUrl=' <%#"~/photos/meb_m2.aspx?TypeID="+DataBinder.Eval(Container.DataItem,"TypeID")   %> ' 
                                                                                                                Style="left:   4px;   position:   relative"   Width="102px"   />
------------------------
修改为<a href='<%#"~/photos/meb_m2.aspx?TypeID="+DataBinder.Eval(Container.DataItem,"TypeID")%>'><img src=' <%#DataBinder.Eval(Container.DataItem,"TypeUrl")%>' alt="图片" onload="javascript:resizeimg(this,100,200)" ></img></a>
把我的JS函数放在<head></head>之间

Answer 5

等比例缩放：
            string pic = context.Request["pic"];
            int W = 100;
            int H = 100;
            try
            {
                 W = int.Parse(context.Request["W"]);
                 H = int.Parse(context.Request["H"]);
            }
            catch
            {
                context.Response.End();
            }
            if(pic==null || pic=="" || W<=0 || H<=0 || pic.IndexOf(".")<1)
            {
                context.Response.End();
            }
            
            
            Bitmap bit = new Bitmap(System.Configuration.ConfigurationManager.AppSettings["UpLoadFile"] + pic.Replace("/upload/", "").Replace("/images/",""));
            MemoryStream ms = new MemoryStream();
            int newh = 0;
            int neww = 0;
            //
            if (bit.Width < W && bit.Height < H)
            {
                newh = bit.Height;
                neww = bit.Width;
            }
            else
            {
                double pwidth = (double)bit.Width / W;
                double pheight = (double)bit.Height / H;
                if (pwidth > pheight)
                {
                    neww = W;
                    newh = Convert.ToInt32(bit.Height / pwidth);
                }
                else
                {
                    newh = H;
                    neww = Convert.ToInt32(bit.Width / pheight);
                }
            }
            //生成小图
            Bitmap newbit = new Bitmap(bit, neww, newh);
            newbit.Save(ms, System.Drawing.Imaging.ImageFormat.Jpeg);
            context.Response.ContentType = "image/jpeg";
            context.Response.StatusCode = 200;
            context.Response.BinaryWrite(ms.ToArray());

Answer 6

Bitmap bit = new Bitmap(System.Configuration.ConfigurationManager.AppSettings["UpLoadFile"] + pic.Replace("/upload/", "").Replace("/images/",""));
这个是什么意思？

Answer 7

Bitmap   bit   =   new   Bitmap
创建一个新bit 
System.Configuration.ConfigurationManager.AppSettings["UpLoadFile"]   +   pic.Replace("/upload/",   "").Replace("/images/","")); 
图片路径
System.Configuration.ConfigurationManager.AppSettings["UpLoadFile"]这个在webconfig设置的路径key
<appSettings>
    <add key="WebSite" value="http://192.168.1.207:8011" />
    <add key="UpLoadFile" value="E:\dingfang8ver2\WebSite\upload\" />
</appSettings>