While testing a sub theme on 7.x-4.0-rc2, I noticed that I could zoom in and out on iOS and Android devices. Looking at the viewport meta tag, it seems that the content was set to "width=device-width", but didn't have the "maximum-scale = 1.0" portion. I'm unsure if that was on purpose, or a bug. If it is on purpose, it might be good to document. I fixed this for my sub theme by adding the following to my template.php:

/**
 * Implements hook_html_head_alter().
 */
function MYTHEME_html_head_alter(&$head_elements) {

  // Optimize mobile viewport.
  $head_elements['mobile_viewport'] = array(
    '#type' => 'html_tag',
    '#tag' => 'meta',
    '#attributes' => array(
      'name' => 'viewport',
      'content' => 'width=device-width, maximum-scale = 1.0',
    ),
  );

}

I'm not familiar enough with the specifics of the viewport meta tag to know if there was a reason for how it was set up. If this was intentional, then hopefully this saves someone time. Otherwise, perhaps the zurb_foundation_html_head_alter() function should have the ", maximum-scale = 1.0" string added.

Comments

nickBumgarner’s picture

I've also had to do that on previous Foundation 4 projects I've worked on as well. The only reason I've had to add that is because I was building an off canvas layout which would cause the devices to zoom out when activated.

kevinquillen’s picture

Status: Active » Fixed

Pushed to dev - don't see the harm in having it.

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.