Is it possible to hide an id element in some browsers?
say that I have an id defi开发者_如何学运维ned like this
<span id ="radiobuttonContainer"> Check to enable checkboxes:
<input type="radio" name="cov-failed" value="cover" onclick="javascript:printoutCheckboxes('cover')">
Coverage
<input type="radio" name="cov-failed" value="failed" onclick="javascript:printoutCheckboxes('failed')">
Failed</span>
I dont want to show this "spanId" in browsers below I.E 9 Because this enables alot more vizualizing of data which IE < 8 don't can manage. I know that you can have diffrent javascripts and css:es depending on browsers like this
<!--[if lte IE 8]><script language="javascript" type="text/javascript" src="root/include/excanvas.min.js"></script><![endif]-->
And then chose display: 'none';
But I wonder if it really is nessecary to have 2 equal .css files containing exactly the same information besides this single row?
Can't I just do something like this?
<!--[if lte IE 8]>document.getElementById('radiobuttonContainer').style.display = 'none';<![endif]-->
you should just be able to wrap the tag in a conditional comment. alternately, since CSS included inline in the page takes precedence over included CSS, you wouldn't have to include a second style sheet, just a new definition specific for that case. i.e.
<!--[if lte IE 8]>
<style type="text/css">
#radiobuttonContainer{
display = 'none';
};
<![endif]-->
and have that come after your included CSS file.
if you use a tool like Modernizr, you can use it to determine the capabilities of the browser.
If there's a particular feature which isn't available in IE8, you can reference it in your stylesheet, and hide this element if the browser doesn't have that feature.
Lets say the feature is HTML5 canvas, all you'd need to do is the one line script to include the Modernizr Javascript in your page, and then you'd do something like this in your CSS:
.nocanvas .radiobuttonContainer {
display:none;
}
I think you can surely do something like this:
<!--[if lte IE 8]><script type="text/javascript">
document.getElementById('radiobuttonContainer').style.display = 'none';
</script><![endif]-->
which is a merge of your examples by the way.
精彩评论