发表新帖
发表新帖

How to display browser specific HTML?

后端 未结
关注
9 639
遇见更好的自我
遇见更好的自我 2020-12-06 10:48

I\'m trying to find a way to display one link to an IE user and another link to all other browsers using javascript or conditional comments (or whatever it takes).

B

相关标签:
9条回答
  • 遥遥无期
    2020-12-06 11:23

    One way that I've figured out how to do it:

    Get the javascript code from http://www.quirksmode.org/js/detect.html and put it in the <head> tag.

    Then in your <body> tag use:

    <script type="text/javascript">
<!--
if (BrowserDetect.browser == 'Explorer') {
    document.write('<a href="#">Explorer</a>');
} else {
    document.write('<a href="#">Other Browsers</a>');
}
// -->
</script>

    Not sure if this is the most simple way to do it but it got the job done.

    0 讨论(0)
  • 心在旅途
    2020-12-06 11:25

    This is the Microsoft-approved way:

    <!--[if IE]>
    <a href="ie-only.html">click here!</a>
<![endif]-->
<![if !IE]>
    <a href="all-other-browsers.html">click here!</a>
<![endif]>

    More information available at http://msdn.microsoft.com/en-us/library/ms537512(VS.85).aspx.

    Edit

    This code is implicitly guaranteed to work in all current and future versions of IE starting with IE 5. For non-IE browsers, the code works by relying on those browsers ignoring the "nonsensical" <![if !IE]> tag, which they all do, and I've never seen it fail. For a version that uses nothing but good ol' HTML comments, see bobince's answer, which I actually prefer to the Microsoft-provided solution.

    0 讨论(0)
  • 星月不相逢
    2020-12-06 11:28

    Add this to your header : 

    <script src="http://github.com/rafaelp/css_browser_selector/raw/master/css_browser_selector.js" type="text/javascript"></script>

    Then whatever you want to your .css page :

    /* Chrome Only */
.chrome embed {
    display: none;
}

/* Firefox Only */
.gecko video {
    display: none;
}

    Source : http://rafael.adm.br/css_browser_selector/

    Available Browser Codes [browser]:

    ie - Internet Explorer (All versions)
ie8 - Internet Explorer 8.x
ie7 - Internet Explorer 7.x
ie6 - Internet Explorer 6.x
ie5 - Internet Explorer 5.x
gecko - Mozilla, Firefox (all versions), Camino
ff2 - Firefox 2
ff3 - Firefox 3
ff3_5 - Firefox 3.5
ff3_6 - Firefox 3.6 new
opera - Opera (All versions)
opera8 - Opera 8.x
opera9 - Opera 9.x
opera10 - Opera 10.x
konqueror - Konqueror
webkit or safari - Safari, NetNewsWire, OmniWeb, Shiira, Google Chrome
safari3 - Safari 3.x
chrome - Google Chrome
iron - SRWare Iron
    0 讨论(0)
  • 耶瑟儿～
    2020-12-06 11:31

    A shot in the dark, maybe, but would this work?

    <style>

    a.forIeOnly {display: none; }
    a.notForIe  {display: block; }

</style>

<!--[if ie]>

<style>
    a.forIeOnly {display: block;}
    a.notForIe  {display: none; }
</style>

<![endif]-->

<a href="#" class="forIeOnly">Link One</a>
<a href="#" class="notForIe">Link Two</a>

    It's nowhere near as clean/attractive as an if/else statement could be, but...it was the easiest way I could think of to implement a solution. Though it may well be fraught with issues all of its own.

    0 讨论(0)
  • 南旧
    2020-12-06 11:32

    I don't think this is possible with conditional comment tags (which only work in internet explorer)

    Sure it is. You just have to leave the content for non-IE browsers in a position such that it's part of a conditional comment clause but not actually inside a <!-- comment -->. Then browsers that don't know about conditional comments will see the content fine. This is known as a downlevel-revealed conditional comment.

    Unfortunately the markup Microsoft give you there is invalid HTML (and not even well-formed XML). To make it pass muster you just need a few additional ‘--’s:

    <!--[if IE]> This is IE! <![endif]-->
<!--[if !IE]><!--> This ain't IE! <!--<![endif]-->

    Although I have to echo AnonJr's non-answer, in that it's rare you should need a completely separate link/page for IE compared to other browsers. If you're doing something tricky like complex VML and ActiveX work in IE with Flash on other browsers I guess there could be a reason for it, but usually a few CSS and script hacks over the same basic page should suffice.

    0 讨论(0)
  • 盖世英雄少女心
    2020-12-06 11:39

    You could always use CSS to hide the code from specific browsers. For instance, considering the following code:

    <a href"ie-only.html" id="ie-only">click here!</a>
<a href"all-other-browsers.html" id="other-browsers">click here!</a>

    You could apply the following CSS hacks, and the appropriate links would be displayed to the appropriate browsers.

    /* Display settings for most browsers */
#ie-only {display: none;}
#other-browsers {display: block;}

/* Display settings for IE <= 6 */
* html #ie-only {display: block;}
* html #other-browsers {display: none;}
    0 讨论(0)
 看不清?
提交回复
热议问题