通过动态图像处理程序渲染的图像进行布局固定

| 我正在使用httphandler动态调整页面上呈现的图像的大小。我有一个预设宽度,所有图像都必须确认-图像的高度可以变化(比例限制为原始宽度和高度)。我正在缓存图像-但是,当最初加载图像时,将在呈现页面后调用httphandler-因此,对于较长的图像-有时在初始加载时,较大的图像会因为其与下面的内容重叠而中断布局。这是http://www.teakmonkeystudios.ca/photos/photo.aspx?id=10801处的示例屏幕截图: 这是CSS:
.gallery
{

    margin-left:0px;
    padding-left:5px;
}


ul.gallery div.top_frame
{
       width:732px
}


ul.gallery div.view_frame
{
    margin-left:5px;
}

ul.gallery div.image_frame
{
    border: 1px solid #dddddd; padding-top: 5px; height:100%; min-height:490px;
    padding-bottom: 5px; text-align: center;
}

ul.gallery div.button_frame
{
    width: 732px; text-align: right; margin: 4px 0px 0px 0px;
}


ul.gallery div.name_frame, ul.gallery div.original_name_frame
{

    margin: 0px 0px 0px 5px;
}

ul.gallery div.name_frame h2
{
    margin: 2px 0px 3px 0px;
    padding: 0px;

}

ul.gallery div.date_frame
{
    margin-left:5px;
    margin-bottom:5px;
}

ul.gallery div.update_frame
{
    width: 732px; margin-bottom: 5px; margin-top: 5px;text-align:right;
}



ul.gallery div.desc_frame
{
    margin-left:5px;
    background-color:#eeeeee;

}

ul.gallery li
{
     width: 732px;

     display: -moz-inline-stack;
     display: inline-block;
     vertical-align:top;
     margin: 5px;
     zoom: 1;
     *display: inline;
     _height:100%;
      color:#000000;
      letter-spacing:0px;
      line-height:normal;

} 

ul.breadcrumbs li
{
    float:left;

    margin:0px;
    padding:0px;
    width:100%;
}

ul.breadcrumbs li a
{
    font-size:12px;
}
由于以下屏幕快照中的图像可能已缓存,因此您可能看不到损坏的布局。我想知道在表格中渲染图像会更好吗?还是有CSS修复程序?我什至尝试了Jquery,并准备好使用文档来调整图像容器的高度-但是图像可能无法加载-因此我无法在函数中返回图像的高度。有关如何解决此问题的任何建议?
已邀请:
如果所有图像的宽度都相同,则输出带有width属性的IMG标签。这可能会有所帮助。
<img src=\"...\" width=\"720\">
在此类应用中使用
input type=\"image\"
有点奇怪。为什么不只使用包裹在图像上的A标签呢?
这是解决问题的关键: 但是,当最初加载它们时,将在呈现页面后调用httphandler IHttpHandler会在将响应发送到浏览器之前看到请求,并且可以执行所需的任何操作,包括使用调整大小的图像进行响应。我正在做很多事情,从来没有问题。由于它对您不起作用,所以我100%表示您的HttpHandler中存在错误。
如果我创建图像并将其在自定义图像的prerender事件中加载到缓存中,则似乎已解决了此问题。最初,该控件将图像信息呈现到浏览器中的src字符串,然后该图像被调用cachemanager的httphandler拦截(如果存在,则返回-如果不存在,则创建)。由于上述问题似乎仅在最初创建映像时才会发生-我认为在“请求”之前重新创建它可能会有所帮助-看来确实可以。如果有此后果-我将编辑我的解决方案。

要回复问题请先登录注册