Using Response.js to make IE6/IE7/IE8 understand your responsive design

Web creator like you, learned the mantra of responsive design for web, now have to face with the gigantic war elephant (yes, the name I used to call the legendary IE).

Many weapons and tactics have invented by many web creator, and fortunately, a lot of them is useful and you can relied on, and Response.js is one of the weapon you can use.

(You can read the full list of those ‘weapon’ in my article: How to keep your responsive web design against the legendary Internet explorer (IE6/IE7/IE8))

What is Response.js?

Response.js is a javascript framework founded by Scott Jehl. This lightweight javascript will help you pass the problem that CSS3 media queries doesn’t work on those legendary IE.

What would it do for you?

I found the best way to explain how will response.js help you is step-by-step:

  1. Generally, the legendary IE (IE6/IE7/IE8, or any version before IE9) cannot get the CSS content in media queries with its pre-parsing state.
  2. The CSS content would disappear, make those legendary IE show your cool responsive style.
  3. So response.js come to help you in this part.
  4. Response.js will request CSS file using Ajax, and with looping through CSS with regular expression, each CSS rule with media queries will be appended to HEAD.
  5. Yes, it’s sweet. So now your responsive design will available on legendary IE.

Quick note about using it

  • Put response.js after all CSS you use in web page. Except you are ready for weird action.
  • Response.js works well with following CSS3 media queries’s declaration. Other option will be considered in future.
    • min-width
    • max-width
    • all media types.
  • Response.js built to make… yes, IE8 and under, can work with media queries. For another web browser which still not support media queries, please keep following it update.
  • Response.js has an issue with CDN & domain. Click here to take a look in how to solve the problem.

So if you’re ready, click here and look for more detail in its github page.

You can looking for another tool and framework to fight against the legendary IE by click here to see my first article in this serie.


Loading Facebook Comments ...