CODEWITHSUNDEEP
javascriptcssgoogle-chrome
Alan
Alan

Reputation: 527

How to make existing javascript/css files be compatible in Google Chrome?

We have one existing web application which was running in IE browser. But because of some reasons, now we need install Google Chrome Frame plug-in in IE to make it be running just like in Google Chrome.

So now the biggest problem is that we need find the incompatible javascript and css codes and make it behave the same in google Chrome.

Are there any tools or easier ways to do that?

Upvotes: 1

Views: 209

Answers (3)

danjah
danjah

Reputation: 3059

I won't come to the party with Dev console solutions, Brad covered that well -

But in addition to that answer, and I don't know if it's feasible in your situation, but for CSS I'd normally start with FF/Chrome and add in compat for IE - so it may be easiest for you to wrap new CSS rules and links in IE conditional comments, and bolt on support after your current rules and links load for Chrome, eg;

<link rel="stylesheet" type="text/css" media="all" href="all-browser-styles.css" />
<!--[if !IE]> -->
<link rel="stylesheet" type="text/css" media="all" href="non-ie-fixes.css" />
<!-- <![endif]-->

Upvotes: 1

Prusprus
Prusprus

Reputation: 8065

I would suggest your download firebug, a web browser plugin that will allow you turn any website into your personal sandbox. It will also let you know of the javascript errors.

As far as I know, most errors should be caused by javascript itself, as it's read the same between browsers. Most errors come from css definitions, as for example, there are lots of IE-specific styles that you may be using that are incompatible with other browsers (you'll need to find their equivalent styles for other browsers, such as chrome). This incompatibilities will likely caused your errors in javascript.

Upvotes: 0

Brad
Brad

Reputation: 163313

The best thing to do is go through every problem one-by-one and fix it.

The Chrome developer tools (Control+Shift+J) are very good at pointing out various errors and problems.

  • Check the errors showing up in the JavaScript console, to see JavaScript errors, incorrect MIME types, missing files, etc.
  • Use the elements tab and mouse over the DOM to see elements get highlighted on your page. This will help you understand why certain CSS causes things to be placed in unexpected places. You can also change the CSS from here and see your result immediately.
  • The network tab might help you see AJAX requests

There are other tools available, but these will be most useful to you.

Upvotes: 4

Related Questions