Those Cross-Browser Blues: How To Develop Web Sites For Both Internet Explorer And Firefox - InformationWeek
09:40 AM
Connect Directly
Moving UEBA Beyond the Ground Floor
Sep 20, 2017
This webinar will provide the details you need about UEBA so you can make the decisions on how bes ...Read More>>

Those Cross-Browser Blues: How To Develop Web Sites For Both Internet Explorer And Firefox

If you're trying to develop sites that will be compatible with IE, Firefox, and Opera, watch out -- there are still a lot of speed bumps out there. We examine six of them and let you in on some solutions.

JavaScript And Automation

"Fussy" is the nicest word I have for the way JavaScript can be implemented across platforms. What works fine in one place will simply not work at all in another, or won't work as intended. While there's a common pool of commands that is shared by almost every browser's implementation of JavaScript, there are a few that simply don't exist in one browser or the other.

IE, for instance, doesn't implement the JavaScript function getComputedStyle() or the cssRules[] array, while Firefox doesn't implement the handy innerText function. And up until fairly recently (version 9.2 or so), Opera didn't allow frames to be resized via JavaScript. A small omission, sure, but it drove me up one wall and down another, since I was using a JavaScript-resized frame to accomplish a very specific effect that I had a hard time doing another way. (I eventually found another way to do it, but only after the Opera behavior already had been fixed.)

In the same vein, browsers have different ways of reporting back the size of a given window, which can play havoc with window manipulations. In IE, a window's measurements include the "chrome" (scrollbars, menuing elements, status bar, etc.), but in Mozilla, the window's measurements don't include any of that and just run from one inner edge of the window to the other. This makes it slightly harder to create, for instance, a JavaScript window resize that operates reliably across both browsers without handling each browser as a separate case. (Here's a page that talks about the ways different browsers interpret JavaScript window size functions.)

Three basic solutions present themselves here:

A. Drop back to a common base of JavaScript for all browser projects. This may only be viable if you have the time and effort to rework all the existing JS code from scratch, as it may be a fairly major undertaking. This means insuring that no future code uses JS that isn't supported on the majority of platforms as well. On the plus side, it means you only have one branch of the code to deal with. Sometimes you can implement individual functions that you need by using "spot cheats," like Scot Hanselman's way to implement the innerText function in Firefox.

B. Use browser detection and browser-specific code. This approach requires that you maintain at least two separate branches of code (IE vs. everything else, essentially), so it's that much more work. One way to implement these kinds of changes in CSS itself without using browser-detection per se is to use conditional style sheets, which apply patches to CSS styles that work for IE but not FF (or vice versa).

C. Use cross-browser libraries. If you want to write JavaScript that works cross-browser every time, one way to do that is to use someone else's JavaScript function library that's been designed to do that kind of work for you. Consider the GNU LGPL-licensed libraries, which package a whole host of useful JS functions in ways that work with pretty much every browser out there. You don't have to include the whole gallery of functions on a given site; you can pick and choose what's needed and keep your include files relatively small. Yootools is another cross-browser function library with some fairly advanced features, including a Window.Size function that helps work around cross-browser window-size issues.

3 of 5
Comment  | 
Print  | 
More Insights
Threaded  |  Newest First  |  Oldest First
How Enterprises Are Attacking the IT Security Enterprise
How Enterprises Are Attacking the IT Security Enterprise
To learn more about what organizations are doing to tackle attacks and threats we surveyed a group of 300 IT and infosec professionals to find out what their biggest IT security challenges are and what they're doing to defend against today's threats. Download the report to see what they're saying.
Register for InformationWeek Newsletters
White Papers
Current Issue
IT Strategies to Conquer the Cloud
Chances are your organization is adopting cloud computing in one way or another -- or in multiple ways. Understanding the skills you need and how cloud affects IT operations and networking will help you adapt.
Twitter Feed
Sponsored Live Streaming Video
Everything You've Been Told About Mobility Is Wrong
Attend this video symposium with Sean Wisdom, Global Director of Mobility Solutions, and learn about how you can harness powerful new products to mobilize your business potential.
Flash Poll