hide address bar in mobile browsers, add apple web app meta

master
Hakim El Hattab 2012-05-06 22:05:58 -04:00
parent ec1c111359
commit 1013ff7ba5
4 changed files with 71 additions and 42 deletions

View File

@ -119,6 +119,7 @@ Reveal.addEventListener( 'slidechanged', function( event ) {
- Added event binding methods (Reveal.addEventListener, Reveal.removeEventListener)
- Added 'slidechanged' event
- Added print styles. Thanks [skypanther](https://github.com/skypanther)
- The address bar now hides automatically on mobile browsers
#### 1.2

View File

@ -8,6 +8,9 @@
<meta name="description" content="An easy to use CSS 3D slideshow tool for quickly creating good looking HTML presentations.">
<meta name="author" content="Hakim El Hattab">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<link href='http://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic' rel='stylesheet' type='text/css'>

View File

@ -10,6 +10,8 @@ var Reveal = (function(){
var HORIZONTAL_SLIDES_SELECTOR = '#reveal .slides>section',
VERTICAL_SLIDES_SELECTOR = '#reveal .slides>section.present>section',
IS_TOUCH_DEVICE = !!( 'ontouchstart' in window ),
// The horizontal and verical index of the currently active slide
indexh = 0,
indexv = 0,
@ -111,8 +113,8 @@ var Reveal = (function(){
}
if( config.mouseWheel ) {
document.addEventListener('DOMMouseScroll', onDocumentMouseScroll, false); // FF
document.addEventListener('mousewheel', onDocumentMouseScroll, false);
document.addEventListener( 'DOMMouseScroll', onDocumentMouseScroll, false ); // FF
document.addEventListener( 'mousewheel', onDocumentMouseScroll, false );
}
if( config.rollingLinks ) {
@ -122,6 +124,17 @@ var Reveal = (function(){
// Read the initial hash
readURL();
// Set up hiding of the browser address bar
if( navigator.userAgent.match( /(iphone|ipod|android)/i ) ) {
// Give the page some scrollable overflow
document.documentElement.style.overflow = 'scroll';
document.body.style.height = '120%';
// Events that should trigger the address bar to hide
window.addEventListener( 'load', removeAddressBar, false );
window.addEventListener( 'orientationchange', removeAddressBar, false );
}
}
/**
@ -147,6 +160,16 @@ var Reveal = (function(){
delegate.call();
}
}
/**
* Causes the address bar to hide on mobile devices,
* more vertical space ftw.
*/
function removeAddressBar() {
setTimeout( function() {
window.scrollTo( 0, 1 );
}, 0 );
}
/**
* Handler for the document level 'keydown' event.

82
js/reveal.min.js vendored

File diff suppressed because one or more lines are too long