Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

browser detect CSS 1

Status
Not open for further replies.
missplume

missplume

Technical User
Sep 4, 2001
29
US
I am just starting to dabble in Javascript and I'd like to link one page to several External Style Sheets. Each sheet would work for different browser. What kind of "browser detect" trick can I use to tell it to use this or that style sheet.
I'd like something along the line:
If Browserx is detected then use browserx.css
If Browsery is detected then use browsery.css
If browserz is detected then use browserz.css

I am desperately trying to avoid having to create several browser specific copies of the same page!
Thanks for your time!
 
Sort by date Sort by votes
here's the script for ie and netscape...

<script language=javascript>

b=navigator.appName // browser name
v=navigator.appVersion // version #
p=navigator.platform // operating platform

ie='Microsoft Internet Explorer'
ns='Netscape'

document.write(&quot;<link rel=stylesheet type='text/css' href='&quot;)

if (b==ie) {document.write(&quot;ie.css'>&quot;}
if (b==ns) {document.write(&quot;ns.css'>&quot;}

</script>

i don't recall the opera and other browser names...try using keyword search 'browser detection' in the javascript forum...

- spewn

 
Upvote 0 Downvote
Is it possible to put this code in an external file and still write the response in the HTML page?

<script language=javascript>

b=navigator.appName // browser name
v=navigator.appVersion // version #
p=navigator.platform // operating platform

ie='Microsoft Internet Explorer'
ns='Netscape'

document.write(&quot;<link rel=stylesheet type='text/css' href='&quot;)

if (b==ie) {document.write(&quot;ie.css'>&quot;}
if (b==ns) {document.write(&quot;ns.css'>&quot;}

</script>
 
Upvote 0 Downvote
you can add every and anything written in js to a external file. simply take the <script> tags out and change to a function. then onLoad event in the page call the function.
so
<script language=&quot;javascript&quot; src=&quot;brows.js&quot;></script>
containsb=navigator.appName // browser name
function browDetect {
v=navigator.appVersion // version #
p=navigator.platform // operating platform

ie='Microsoft Internet Explorer'
ns='Netscape'

document.write(&quot;<link rel=stylesheet type='text/css' href='&quot;)

if (b==ie) {document.write(&quot;ie.css'>&quot;}
if (b==ns) {document.write(&quot;ns.css'>&quot;}
}

then event in the page.
<body onLoad=&quot;browDetect()&quot;>

or you could palce it where you want by simply doing
<script language=&quot;javascript&quot;> { browDetect(); } </script> ---------------------------------------
{ str = &quot;sleep is good for you. sleep gives you the energy you need to function&quot;;
ptr = /sleep/gi;Nstr = str.replace(ptr,&quot;coffee&quot;);alert(Nstr); }

 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

RailBatyrshin
  • Locked
  • Question
Back on the Node(ExpressJS) fetch API from WEB Browser
Replies
0
Views
82
RailBatyrshin
RailBatyrshin
Krus1972
  • Locked
  • Question
Pop-up Blocker Detecter
Replies
1
Views
95
spamjim
spamjim
javierdlm001
  • Locked
  • Question
Can JS &amp; CSS code located remotely run locally? 1
Replies
2
Views
76
javierdlm001
javierdlm001
PeDa
  • Locked
  • Question
Can only obtain element height if browser not maximised 1
Replies
2
Views
101
PeDa
PeDa
c0deM0nK424
  • Locked
  • Question
auto detect viewport or screen size and load different images for flexslider carosel ?
Replies
0
Views
74
c0deM0nK424
c0deM0nK424

Part and Inventory Search

Sponsor

Back
Top