Skip to content

Instantly share code, notes, and snippets.

@pronebird
Created October 27, 2014 14:32
Show Gist options
  • Save pronebird/75eed8b491d187b65f80 to your computer and use it in GitHub Desktop.
Save pronebird/75eed8b491d187b65f80 to your computer and use it in GitHub Desktop.
Show a help tip how to hide navigation bars on Mobile Safari when in landscape
//
// A helper function to toggle a help tip
// about how to hide Safari address bar when it's visible
// Monitors only landscape mode and works on Safari on iOS 8+
//
// This is a part of my post on Coderwall: https://coderwall.com/p/yaro4w
//
var attachMobileSafariAddressBarHelpTip = function (target) {
var $target = $(target);
$target.tooltip({
title: 'Scroll up to hide Safari address bar',
trigger: 'manual',
placement: 'bottom'
});
$(window).on('resize', function () {
var bodyHeight = document.body.offsetHeight;
var windowHeight = window.innerHeight;
var isLandscape = Math.abs(window.orientation) === 90;
var showTooltip = (windowHeight < bodyHeight);
if(!isLandscape) return;
$target.tooltip(showTooltip ? 'show' : 'hide');
});
}
var ua = window.navigator.userAgent;
if(ua.indexOf('iPhone') !== -1 && ua.indexOf('Safari') !== -1) {
attachMobileSafariAddressBarHelpTip('#main-nav');
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment