WIP #1585 @0.5

diff --git a/js/libs/fluidbook/fluidbook.menu.js b/js/libs/fluidbook/fluidbook.menu.js
index 9a10d2b7a897480359c24bb276bcac9b25f9d643..26835faf51b8e6a923194e9aa0353fc03f0de04a 100644 (file)
--- a/js/libs/fluidbook/fluidbook.menu.js
+++ b/js/libs/fluidbook/fluidbook.menu.js
@@ -8,7 +8,10 @@ FluidbookMenu.prototype = {
         this.index = new FluidbookIndex(this.fluidbook);
         var $this = this;
 
-        $(document).on('click', ".mview .back", function () {
+        // Note: iOS won't catch click events unless the element has a cursor:pointer style
+        // This was added for #viewOverlay in the CSS
+        // More details: https://stackoverflow.com/a/16006333
+        $(document).on('click', ".mview .back, #viewOverlay", function () {
             var currentHash = window.location.hash;
             window.location.hash = '/page/' + $this.fluidbook.currentPage;
             if (window.location.hash == currentHash) {

diff --git a/style/fluidbook.less b/style/fluidbook.less
index ed549d742c85c62274742f5f7e197e6f4af554ef..dfb9d03abc3d9c8a6bc00665f816ee2bd602a00f 100644 (file)
--- a/style/fluidbook.less
+++ b/style/fluidbook.less
@@ -870,7 +870,7 @@ html.ios body.portrait #interface {
        width: 100%;
        height: 100%;
        z-index: 21;
-       cursor: default;
+       cursor: pointer; // Needed or click events don't work on iOS (see: https://stackoverflow.com/a/16006333)
        .overlayBackground();
 }
 
@@ -988,6 +988,7 @@ html.ios body.portrait #interface {
                                width: 60px;
                                height: 60px;
                                padding: 22px;
+                               line-height: 1;
                                background-color: @menu-button-background;
                                z-index: 1;
                        }