PDA

View Full Version : js detect browser



SN1P3R_85
Nov 15th, 2008, 10:43 PM
Hi, i am trying to make a js code that detects the browser name, and based off that, will call a certain css file. I have the js function called like this:
<body onLoad="check_brwz();">

All that happens is the screen is white, non of the html in the file is displayed.

<html>
<head>
<title>CAIDEN'S PAGE</title>

<script type="text/javascript">
<!--
function check_brwz() //checks for browser type so it will apply the correct style format
{
function browser() //sets browser name and version
{
this.name = navigator.appName;
this.version = navigator.appVersion;
}

browse = new browser();

if (browse.name == 'Netscape') //sets the correct style format
{
document.write('<link rel="stylesheet" type="text/css" href="/css/moz_main.css" />');
document.write("hello");
}
else if (browse.name == 'Microsoft Internet Explorer')
{
document.write('<link rel="stylesheet" type="text/css" href="/css/ie_main.css" />');
}
else if (browse.name == 'Opera')
{
document.write('<link rel="stylesheet" type="text/css" href="/css/opera_main.css" />');
}
else //default style format if browser type is unkown
{
alert('your browser is too old or unkown, settings will be set by default to fit Mozilla');
document.write('<link rel="stylesheet" type="text/css" href="/css/moz_main.css" />');
}
alert(browse.name);
}
//-->
</script>

</head>

<body onLoad="check_brwz();">

<div id="headimg">
<center><img src="/pics/head_pic.jpg"></center>
</div>

<table id="toplink">
<tr>
<td width="20%" id="rightbord"><a href="/index.php">home</a></td>
<td width="20%"id="rightbord"><a href="/forums/forum_menu.php">forum</a></td>
<td width="20%"id="rightbord"><a href="/tutorial/index.php">tutorials</a></td>
<td width="20%"id="rightbord"><a href="/source/index.php">source code</a></td>
<td width="20%"><a href="/music/index.php">music</a></td>
</tr>
</table>

<div id="head">
<table style="border-collapse: separate; border-spacing: 30px;">
<tr>
<td><p>This website is under construction, so many of the features on here do not necessarily work. Don't bother to send bug reports for the time being, because I have enough bugs to fix as it is.</p></td>
</tr>
<tr><td></td></tr><tr><td><hr /></td></tr>
<tr><td>My name is Caiden Robinson, I am 17 and go to Capital High School. I enjoy computer programming and building computers. I have been programming for just under a year, and really got into web-based programming a few months ago. Before I started programming, I liked to build and tweak computers. I started to volunteer at a computer shop downtown with another friend, and I learned alot about hardware there. Since my high school requires a senior project to graduate, I figured I would make this website. I want to have a forum that people can discuss computer topics, and help eachother with code.</td></tr>
<tr><td>
<p>On this website I am using CSS, XHTML, PHP, MySQL, and Javascript so far. I have made a forum on here so people may discuss computer hardware, computer software, and computer programming. I plan to add a few tutorials on basic web programming, as well as an interface to present all my source code. I have been doing web-based programming for really only around 2 months. Before that I had a vague knowledge of html, but nothing more. I taught myself PHP, and strengthened by knowledge of CSS and HTML. Once I was familiar enough to write a few server scripts for my site, I learned how to manage databases with MySQL through PHP. After this, I learned some Javascript, so I could include dynamic content on my webpage. I am in the process of learning Javascript, and cannot write advanced scripts yet. I have also done some AJAX(Asynchronous Javavascript And XML), which is an advanced tool that uses xml and Javascript to contact the server and make dynamic changes to the site without reloading the page.</p>
</td></tr>
</td></tr>
</table>
</div><p>


<table id="leftlink">
<tr><td valign="top" height="1%">
<a href="/report_bug.php">report bug</a>
</td></tr><tr><td height="10%"><hr /></td></tr>
<tr><td height="10%"><a href="/js_proj.php">javascript projects</a>
</td></tr>
<tr><td height="10%"><hr /></td></tr>
<tr><td height="10%"><a href="http://caidenhome.pastebin.com/f5ba88d03">pastebin</a></td></tr>
</table>

</body>
</html>

SN1P3R_85
Nov 15th, 2008, 10:45 PM
btw, i forgot to say. I know that the javascript detects my browser, because i have an alert(browse.name) at the bottom of the code, and it alerts it correctly. It just won't allow the html to print on the screen.

SN1P3R_85
Nov 15th, 2008, 11:53 PM
c'mon, what is so hard about my code. Did i present it in the wrong format or something?

Philip M
Nov 16th, 2008, 08:34 AM
Did i present it in the wrong format or something?

Yes, you did not use [code] tags as required by the posting guidelines. And you bumped only 70 minutes after posting - that is always a turn-off. This forum is not some sort of customer service desk with people hanging around just waiting to deal with your questions. And the word "please" is always welcomed. Someone (not me) has expressed his disapproval by giving you bad rep already. :eek:

coothead
Nov 16th, 2008, 11:46 AM
Hi there SN1P3R_85,

what stylesheet would be presented to those with javascript disabled? :eek:

I would suggest that you have one stylesheet for compliant browsers like Opera, Safari or Firefox. and one for IE coded like this...


<link rel="stylesheet" type="text/css" href="main.css">

<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="ie7.css">
<![endif]-->

<!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="ie6.css">
<![endif]-->


Also note that the use of tables for page layout is far from ideal.



A better way to build your website (http://www.boagworld.com/archives/2004/06/a_better_way_to_build_your_website.html)
Why tables for layout is stupid: problems defined, solutions offered (http://www.hotdesign.com/seybold/index.html)
Ten ways to speed up the download time of your web pages (http://www.webcredible.co.uk/user-friendly-resources/web-usability/speed-up-download-time.shtml)
Nested Tables: About the (ab)use of tables as layout tools in webpages. (http://www.dorward.me.uk/www/nested/)
Why Tables Are Bad (For Layout) Compared to Semantic HTML + CSS (http://www.phrogz.net/CSS/WhyTablesAreBadForLayout.html)
Why go table free? (http://www.workingwith.me.uk/tablefree/why/)
Why avoiding tables (for layout) is important (http://davespicks.com/essays/notables.html)


coothead