Respond.js
This Drupal module provides IE 6-8 support for responsive themes. It uses Respond.js, delivering lightweight, fast support for min-width and max-width CSS3 media queries. This module simply loads the JS library and optionally supports Libraries API.
Respond.js lives on Github, so look for documentation, code, and downloads over there.
Why should I use a module?
Since respond.js is a presentational script, its placement within your HTML can dramatically impact page performance and execution time, especially on less capable browsers with slower JS engines. This module takes the guesswork out of placement and puts the script where it will be most effective.
- Optimal location is in the
<head>after your CSS but before most* JS files. - Placing Respond too low in HTML or after too many other JS requests can delay IE's execution by whole seconds, resulting in poor UX.
- Placing Respond in the .info file of a theme causes Drupal to aggregate it with other JS files, which will also delay execution time.
- Theme maintainers should recommend this module to save themselves the trouble of keeping the script updated, and also to save the trouble of fielding support requests (see next section).
Hey, this thing isn't working!!
Go to /admin/config/development/performance. Enable Aggregate and compress CSS files.
Respond.js only works on <link> tags; it will not work on @import stylesheet calls. Drupal 7 uses @import when CSS aggregation is disabled, but uses <link> when CSS aggregation is enabled. The module will complain with an admin error until you enable aggregation.
Notes
Made with love at Four Kitchens
❤ Module was made possible by these amazing developers ❤
* respond.js shouldn't be blocked by JavaScript that runs after the DOM is ready, such as jQuery. On the other hand, presentational enhancements like Modernizr or TypeKit that add classes to <html> may be more important to you than legacy IE support, so you might want those before respond.js. Review your analytics before you decide!