ie6 PNG 修复导致 24 位 PNG 图像在嵌套在带有溢出自动的 div 中时不滚动

发布于 2024-09-09 06:36:30 字数 1558 浏览 2 评论 0原文

我正在对 IE6 使用以下 PNG 修复:

http://www.dillerdesign.com/experiment/DD_belatedPNG /

它在我的文档头部被引用:

<!--[if lt IE 7]>
<script type="text/JavaScript" src="../../Scripts/DD_belatedPNG_0.0.8a-min.js" defer="defer"></script>
<script type="text/JavaScript" src="../../Scripts/DD_PNG_listing.js" defer="defer"></script>
<![endif]--> 

它也在任何 jQuery 脚本等之后被引用。

我有一个表,其中包含 24 位 PNG 文件的图像。该表嵌套在带有 Overflow:auto 的 div 中,以便在表内容超出包含的 div 的高度时滚动。

示例表格行:

    <tr class="odd">
    <th scope="row">
        <input type="checkbox" value="" name="check1b" id="check1b">
    </th>
    <td>
        CIF NWE

    </td>
    <td>
        USD/MT
    </td>
    <td>

        <img height="6" width="7" alt="Price movement indicator: Down" src="/content/images/icons/icons_red_down_arrow.png">

    </td>
    <td>
        -1.00

    </td>
    <td>
        1107.00
-1120.00

    </td>
    <td>

        <img height="6" width="7" alt="Price movement indicator: Down" src="/content/images/icons/icons_red_down_arrow.png">

    </td>
    <td>
        -2.00

    </td>
    <td>

<a href="#" class="spot_quote">
    SPOT
    Quote </a>
    </td>
</tr>

IE6 中的问题是,当我滚动 div 时,PNG 图像保持原样,不会随表格内容的其余部分一起滚动。

任何想法。

I am using the following PNG fix for IE6:

http://www.dillerdesign.com/experiment/DD_belatedPNG/

It is referenced thus in the head of my document:

<!--[if lt IE 7]>
<script type="text/JavaScript" src="../../Scripts/DD_belatedPNG_0.0.8a-min.js" defer="defer"></script>
<script type="text/JavaScript" src="../../Scripts/DD_PNG_listing.js" defer="defer"></script>
<![endif]--> 

It is also referenced after any jQuery scripts etc.

I have a table which has images that are 24 bit PNG files in it. This table is nested in a div with overflow:auto for scrolling once the table content extends beyond the height of the containing div.

Example table row:

    <tr class="odd">
    <th scope="row">
        <input type="checkbox" value="" name="check1b" id="check1b">
    </th>
    <td>
        CIF NWE

    </td>
    <td>
        USD/MT
    </td>
    <td>

        <img height="6" width="7" alt="Price movement indicator: Down" src="/content/images/icons/icons_red_down_arrow.png">

    </td>
    <td>
        -1.00

    </td>
    <td>
        1107.00
-1120.00

    </td>
    <td>

        <img height="6" width="7" alt="Price movement indicator: Down" src="/content/images/icons/icons_red_down_arrow.png">

    </td>
    <td>
        -2.00

    </td>
    <td>

<a href="#" class="spot_quote">
    SPOT
    Quote </a>
    </td>
</tr>

The issue in IE6 is that when i scroll the div the PNG images stay put and do not scroll with the rest of the table content.

Any ideas.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

爱格式化 2024-09-16 06:36:30

添加position:relative到带有overflow-y:auto的div(父div)

add position:relative to div with overflow-y:auto (the parent div)

时光礼记 2024-09-16 06:36:30

该特定 PNG 修复脚本以涉及 VML 的复杂方式工作。据推测,这与溢出效果不兼容。

尝试不同的脚本;有很多可供选择。选择一个简单的脚本,因为只需替换几个未缩放的、未处理的图像,不需要任何更高级的脚本。

That particular PNG fix script works in a complex way involving VML. Presumably that's not compatible with the overflow effect.

Try a different script; there are plenty to choose from. Go for a simple one, as just to replace a couple of unscaled, untiled images there is no need for any of the more advanced scripts.

鲸落 2024-09-16 06:36:30

由于您已经在页面上安装了 jQuery,因此您可以尝试基于 jQuery 的修复: http://jquery .andreaseberhard.de/pngFix/。您也可以尝试这个:http://www.ideashower.com/our_solutions/png-悬停/

但我真的不喜欢任何基于 AlphaImageLoader 过滤器的解决方案。我只使用 .GIF,其边缘与背景颜色相匹配,这对我来说效果很好。

让我们知道什么有效!

Since you've already got jQuery on the page, you might try a jQuery-based fix: http://jquery.andreaseberhard.de/pngFix/. You may also try this one: http://www.ideashower.com/our_solutions/png-hover/.

But I really don't like any of the AlphaImageLoader filter based solutions. I just use a .GIF, with the edges matted to the background color, and that works pretty well for me.

Let us know what works!

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文