I noticed this on OpenChurch, I am going to have to disable the responsive layout I have for mobile because of it. Basically the 'mobile' layout is what is getting rendered for ie. I would request some way to disable for ie altogether. For instance my OC theme is only using the mobile layout and so I don't really care to load any of the responsive media queries for ie at all.

Support from Acquia helps fund testing for Drupal Acquia logo

Comments

sheena_d’s picture

Project: Fusion » Fusion Accelerator
Version: 7.x-2.0-beta2 » 7.x-2.0-beta1
Category: bug » support
Status: Active » Postponed (maintainer needs more info)

I'm not sure I completely understand the situation. ie_shim is used to enable HTML5 features in IE and is not at all related to responsive layouts. Fusion uses respond.js to create responsive features in IE.

if you do not want to include IE support for responsive layouts in your theme, you can disable the fusion_responsive_ie sub-module of Fusion Accelerator. Do you have that sub-module disabled and respond.js is still loading?

If you could let me know exactly what your theme settings are and provide a link to your site, I may be able to better troubleshoot the issue.

drupalninja99’s picture

Something completely broke the layout in IE when I had responsive turned on. I can try to disable that fusion_responsive_ie module and see if that works. I guess it wasn't related to ie_shim.

drupalninja99’s picture

Status: Postponed (maintainer needs more info) » Needs work

Has no one else reported ie problems with fusion responsive enabled?

drupalninja99’s picture

fusion_responsive_ie is disabled, I have tried disabling and enabling. I don't need any ie support, I just want ie to behave as normal and have responsive behavior for all other browsers/devices.

drupalninja99’s picture

It doesn't looks like respond.js or css3-mediaqueries.js are loading.

drupalninja99’s picture

In fusion_core template.php something is happening after this line that breaks IE

if (module_exists('fusion_accelerator') && theme_get_setting('responsive_enabled')) {

drupalninja99’s picture

IE doesn't like the openchurch_theme.responsive.grid.css even tho this looks like it works fine for other browsers.

If I add the grid12-960 '/themes/fusion/fusion_core/css/grid12-960.css' to an IE conditional, it works fine. I don't want to do a server-side IE check, so I am trying to figure out a way via an IE conditional or something to ignore the responsive stuff in IE.

drupalninja99’s picture

My workaround for now is to force the theme to render the normal grid css in an ie conditional:

function openchurch_theme_preprocess_html(&$vars) {
  global $theme_key;

  $themes = fusion_core_theme_paths($theme_key);
  
  //Grid file
  $file = theme_get_setting('theme_grid') . '.css';
  
  //Grid path
  $path = $themes['fusion_core'];
  
  /**
   * We are forcing the normal grid CSS to load via an IE conditional, even if repsonsive is enabled, this fixes an IE problem
   */
  drupal_add_css($path . '/css/' . $file, array('basename' => 'fusion_core' . '-' . $file, 'group' => CSS_THEME, 'preprocess' => TRUE, 'browsers' => array('IE' => TRUE, '!IE' => FALSE)));
}

This way, in theory, makes IE always use the grid.

Leo Pitt’s picture

I've been running into similar issues on a site I'm building. When css3-mediaqueries.js is loaded, the site is fine across IE7 and IE8.

The problem I've been having seems to be that css3-mediaqueries.js is not present in my page, despite all the instructions being followed.

Looking into fusion_responsive_ie.module code, there is a function fusion_responsive_ie_init() which is where the action takes place - I think it tests whether the browser is IE 6 - 8 and if so it loads the css3-mediaqueries.js library.

But doesn't hook_init only get called when the page isn't cached? And does this mean that the logic determining whether or not css3-mediaqueries.js is inserted gets bypassed when caching is off?

E.g.


/**
 * Implements hook_init().
 */
function fusion_responsive_ie_init() {

  $default_theme = variable_get('theme_default');
  if (theme_get_setting('responsive_enabled', $default_theme) && theme_get_setting('responsive_ie_shim', $default_theme)) {
    $is_admin_page = (strpos($_GET['q'],'admin') === 0) ? TRUE : FALSE;

    // CSS aggregation is required for css3-mediaqueries.js to function properly.
    if (!variable_get('preprocess_css') && $is_admin_page) {
      drupal_set_message(t('Your responsive Fusion theme will not display properly in IE 6-8 until <a href="/admin/config/development/performance">CSS aggregation</a> is enabled.'), 'error');
    }

    $useragent = $_SERVER['HTTP_USER_AGENT'];
    $old_ie = FALSE;

    if (strpos($useragent, 'MSIE') !== FALSE && strpos($useragent, 'Opera') === FALSE && strpos($useragent, 'Netscape') === FALSE) {
      if (preg_match("/Blazer\/([0-9]{1}\.[0-9]{1}(\.[0-9])?)/", $useragent, $matches)) {
        // Do not treat this as IE.  This is the Palm browser, "Blazer".
      }
      elseif (preg_match("/MSIE ([0-9]{1}\.[0-9]{1,2})/", $useragent, $matches)) {
        if ($matches[1] > 5 && $matches[1] < 9) {
          $old_ie = TRUE;
        }
      }
    }

    if ($old_ie) {
      if (!function_exists('libraries_load') && $is_admin_page){
        drupal_set_message(t('The 7.x-2.x branch of <a href="http://drupal.org/project/libraries">Libraries API</a> is required for support of responsive layouts in IE 8 and below.'), 'error');
      } else {
        $library_info = libraries_load('css3-mediaqueries');
        if ($library_info['loaded'] === FALSE && $is_admin_page) {
          drupal_set_message(
            t('The <a href="@link">css3-mediaqueries-js</a> library must be downloaded to support media queries in Internet Explorer prior to version 9.
               Download and save css3-mediaqueries.js into sites/all/libraries/css3-mediaqueries, and Fusion will load the library when IE is detected.',
               array('@link' => $library_info['download url'])
            ),
            'error');
        }
      }
    }    
  }
}

Leo Pitt’s picture

I've worked around by adding a conditional script to my html.tpl.php.

First in template.php:


function THEME_preprocess_html(&$vars) {
  global $base_path;
  global $base_url;
  $vars['base_path'] = $base_path;
  $vars['base_url'] = $base_url;
}

And in html.tpl.php, just prior to the $scripts call:


  <!--[if lt IE 9]> <script type="text/javascript" src="<?php print $base_url . $base_path . libraries_get_path('css3-mediaqueries'); ?>/css3-mediaqueries.js"></script> <![endif]-->

Leo Pitt’s picture

Scratch that last post - turns out that IE was still behaving inconsistently.

In the end used the same approach as #8. :(

nielsonm’s picture

This happens for me when page caching is enabled. I just removed the logic that tests for the browser version and always adds the library if the module is enabled.