IE6 PNG 替换：如何制作嵌套的 可点击？
出于此问题的目的，请考虑以下问题：
<div class="has_transparent_png">
<a href="foo.html">
<span>
<img src="logo.jpg" />
</span>
</a>
</div>
问题：在 IE6 中， 不可点击。这是我正在使用的 PNG 替换：
.has_transparent_png {
background-image: url(images/transparentpng.png);
}
* html .has_transparent_png {
behavior: expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none", this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')", this.src = "images/spacer.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("', '').replace('")', ''), this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='crop')", this.runtimeStyle.backgroundImage = "none")), this.pngSet=true));
}
How can I make the clickable?我无法控制 HTML。只有CSS。提前致谢。
For the purposes of this question, consider this:
<div class="has_transparent_png">
<a href="foo.html">
<span>
<img src="logo.jpg" />
</span>
</a>
</div>
The Problem: In IE6, the <a> is not clickable. Here's the PNG replace I'm using:
.has_transparent_png {
background-image: url(images/transparentpng.png);
}
* html .has_transparent_png {
behavior: expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none", this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')", this.src = "images/spacer.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("', '').replace('")', ''), this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='crop')", this.runtimeStyle.backgroundImage = "none")), this.pngSet=true));
}
How can I make the <a> clickable? I have no control over the HTML. Only the CSS. Thanks in advance.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
不确定这是否有帮助，但似乎您正在设置 DOM 结构来修复 IE6 上的透明图像。您只需在特定 ID 上运行 js 函数即可使用如下脚本来修复图像的透明度： http://homepage.ntlworld.com/bobosola/pnghowto.htm
在页面底部执行类似的操作：
DD_belatedPNG.fix('#imgThatNeedsFix');
希望有帮助。
Not sure if this helps, but it seems that your are setting up that DOM structure to fix a transparent image on IE6. You may simply run a js function on specific ids to fix the transparency on images using a script like this one: http://homepage.ntlworld.com/bobosola/pnghowto.htm
Do something like this at the bottom of your page:
DD_belatedPNG.fix('#imgThatNeedsFix');
Hope that helps.
你可以尝试这样做..
这并不总是有效...
另一种选择是使用兄弟div用png填充整个父div，然后有一个包含锚点并具有a的兄弟div更高的堆叠顺序。
You can try to do..
This won't always work...
Another alternative would be to use a sibling div to fill up the entire parent div with the png and then have a sibling div to that which contains the anchor and has a higher stacking order.
似乎没有办法严格通过 CSS 来做到这一点，而这正是预期的目标。
It seems as though there is no way to do this strictly through CSS, which was the intended goal.