[英]IE Fixes - Conditional Comment Script will not execute
I'm trying to build a website. 我正在尝试建立一个网站。 I have it displaying correctly in every browser except IE versions 8 and lower.
我可以在除IE 8及更低版本以外的所有浏览器中正确显示。 IE renders blue boxes around my img's that are also anchors.
IE在我的img周围也显示了蓝框,它们也是锚点。 I can get rid of this by setting the border property to none but i'd like to do it with javascript.
我可以通过将border属性设置为none来摆脱这种情况,但是我想使用javascript做到这一点。 I can get my Javascript to execute in a conditional comment.
我可以在条件注释中执行我的Javascript。
try
{
var ancs = document.getElementsByTagName("a");
for(var i=0; i<ancs.length; i++)
{
if(ancs[i].childNodes[0].nodeName == "IMG")
{
//Set border property to none
}
}
}
catch(err)
{
alert(err);
}
I am sorry for not answering to the javascript part. 很抱歉没有回答javascript部分。 But you should do it with CSS like this:
但是您应该使用CSS 来做到这一点:
a img { border:0; }
What's your conditional comment look like? 您的条件评论是什么样的? And, why not apply this as a style instead?
而且,为什么不将其用作样式呢? It will be faster than doing it with JavaScript and better supported.
这将比使用JavaScript更快并且得到更好的支持。
IE has a default border style for images that don't specify one themselves. IE对于未自行指定的图像具有默认的边框样式。 This is a known pain of IE.
这是IE的已知问题。 The proper way to fix this is to add a default CSS rule to your page.
解决此问题的正确方法是向页面添加默认CSS规则。 If this is one of the first CSS rules, then it won't affect any other CSS rules you've already set:
如果这是第一批CSS规则之一,那么它将不会影响您已经设置的任何其他CSS规则:
<style type="text/css">
img {border: none;}
</style>
or if you really only want to affect images that are in an <a>
tag, you would use this CSS: 或者,如果您只想影响
<a>
标记中的图像,则可以使用以下CSS:
<style type="text/css">
a img {border: none;}
</style>
If you only want to fix/change one image, you can also address that particular image in the <img>
tag by specifying an inline border: 如果只想修复/更改一张图像,也可以通过指定内嵌边框在
<img>
标记中解决该特定图像:
<img border="0" src="xxxx">
If you really want to do it with javascript, you can place this code either after your page has loaded or call it only once the page is loaded: 如果您真的想使用javascript,可以在页面加载后放置此代码,也可以仅在页面加载后调用它:
function nukeImageBorders() {
// assumes all affected images have an <a> tag as their parent
var list = document.getElementsByTagName("img");
for (var i = 0, len = list.length; i < len; i++) {
if (list[i].parentNode.tagName.toLowerCase() == "a") {
list[i].style.border = "none";
}
}
}
You can see the code work in IE here: http://jsfiddle.net/jfriend00/cnEhY/ 您可以在此处查看IE中的代码工作: http : //jsfiddle.net/jfriend00/cnEhY/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.