Hi, I have added the following line to make IE8 and below to be responsive. However, it doesn't work. I wonder what is missing here?

  <!-- HTML5 element support for IE6-8 -->
  <!--[if lt IE 9]>
    <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <script src="/<?php print $directory; ?>/js/respond.min.js"></script>    
  <![endif]-->

Comments

matthewtrow’s picture

matthewtrow commented

This isn't a bootstrap issue, but rather, a path issue on your side - how are you defining $directory ?
You've also got a slash prepended before that print statement.
Suggest you read up on:
https://api.drupal.org/api/drupal/includes!common.inc/function/drupal_ge...
and also base_path

Your setup in template.php for path variables could be something like:

$variables['base_path'] = base_path();
$variables['path_to_your_theme'] = drupal_get_path('theme', 'your_theme');

And in your html.tpl.php, something like:

<script src="<?php print $base_path . $path_to_your_theme; ?>/js/respond.min.js"></script>

With those vars setup, you can use them across your templates for any custom scripts and other paths to your subtheme folder structure.

simone960’s picture

simone960 commented

Hi,
Thanks for pointing out. To ensure the path is correct, I tried to put in the absolute path, but still not working. I wonder does it work on the sub-domain ?

  <!-- HTML5 element support for IE6-8 -->
  <!--[if lt IE 9]>
    <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <script src="http://subdomain.domain.com/sites/all/themes/bootstrap_mysubtheme/js/respond.min.js"></script>    
  <![endif]-->
markhalliwell’s picture

markhalliwell
Primary language English
commented
Version: 7.x-3.0-rc1 » 7.x-3.x-dev
Component: Code » Documentation
Status: Active » Postponed (maintainer needs more info)

Do you have any JS console errors, like "method .on doesn't exist". If so, this means you don't have jQuery at a minimum of 1.7, which would halt the rest of the page's JS from executing.

simone960’s picture

simone960 commented

I'm using jQuery 1.7 (jquery update module). There's no error in the JS console when running ie8.

Has anyone successfully implemented respond.js on boostrap3 and working on IE8 and below ?

I actually expected this feature to be included in the theme rather to be done separately. After all, there's still a number of IE8's users we need to cater for. Please advise further. Thanks.

markhalliwell’s picture

markhalliwell
Primary language English
commented
Status: Postponed (maintainer needs more info) » Closed (works as designed)

Use https://drupal.org/project/respondjs and read it's installation instructions.

I actually expected this feature to be included in the theme rather to be done separately. After all, there's still a number of IE8's users we need to cater for.

Bootstrap itself does not "include" this, nor will we. Using Response.js for IE8 only "caters" to the < 5% IE8 use cases. No one has any desire to duplication existing solutions.

simone960’s picture

simone960 commented

Thanks for your guidance and clarification. Well, when we are working for the client whose company still using outdated IE on the good old Window version~ not much choice we have :) But the good news is, they start using smart phone... give them time ;)

Thanks anyway.

h3llomrj’s picture

h3llomrj commented

Hey, I was able to get respond.js working, but you can't use the Bootstrap CDN. You have to use the non CDN method and place all the bootstrap files on your server and call them from your html.tpl.php. You can't call it from the theme info file because respond.js doesn't support @import that Drupal uses to include your CSS files. All of this is noted in the respond.js documentation, but you have to hunt for it.

This is something that wouldn't hurt to be included under "IE Compatibility" in the documentation. If the Bootstrap 3 documentation explicitly states the use of respond.js it wouldn't hurt to state it here as well, but with the requirements outlined above.

valkum’s picture

valkum commented

https://drupal.org/node/1000472
Use aggregation should fix this for you.

simone960’s picture

simone960 commented

Thanks @ukcph_matt, thanks for the explanation and hints, now only I fully understand what is going on and get it working finally :)

Thanks @valkum. Ya, need to turn on this function if we were to include those CSS files in the theme info file instead.

Thanks everyone !

lorenz’s picture

lorenz commented

I had the same problem and solved it adding respond.js in the .info file of my theme:

scripts[] = js/respond.js