CrossBrowser Issues

The best way to eliminate the cross browser issue is to detect the Browser and to make our CSS act acccordingly. There are so many ways to handle different Browsers. We have

• Inline Branching
• Page Branching
• Custom Objects

First we will have a look at the Inline and Page Branching.

Inline Branching

Using an if() statement or some other
control structure to check the browser and then performing the action based on the browser is called Inline Branching.
For eg, the getElementById() method is a good way to test
whether a browser supports the W3C DOM.

if (!document.getElementById) {

 return

}The rest of the code

if the browser returns undefined from
document.getElementById, then the script exits without moving on to the
rest of the code, which would likely generate errors or possibly even cause the
browser to crash. This is the most drastic scenario, but it’s necessary in
this case because the code is pure W3C DOM, so there’s no way to create the
equivalent in another object model.

If the result returns true then we should perform certain action, if false then the other

if (browser x) { 

 Code that's specific to browser x

}

else if (browser y) {  

Code that's specific to browser y

}

else {

  Code for all other browsers

}

Page Branching

Page branching is similar in that you first use if() or some
other kind of test to determine the user’s browser. However, in this case
you send the user to an entirely different page based on the result of the
test:

if (browser A)

{  location.replace(browserA.html)

}

else if (browser B)

{  location.replace(browserB.html)

}

else

{  location.replace(others.html)

}

Page branching is useful when the different browsers require substantially
different scripts or HTML. For example, if your script can be implemented only
in Netscape 4 using quite a few <layer> tags, then it’s
probably a good idea to put the Netscape 4 code and tags in a different page.
The downside to this approach is that you end up with (at least) two sets of
HTML and JavaScript code to maintain, which is nobody’s idea of a good
time. For this reason, most site designers use page branching only while
it’s absolutely necessary.

Powered by ScribeFire.