Allow scroll in computers that put the navigation over scroll control. When the document is ready it will check the difference between the body-inner and the page-wrapper width to move the layer only this width allowing the user to scroll.

1 files changed, 10 insertions, 4 deletions

diff --git a/theme/javascript/app.js b/theme/javascript/app.js
index d877c53..eba2f56 100644
--- a/theme/javascript/app.js
+++ b/theme/javascript/app.js
@@ -12,8 +12,16 @@ require([
     "core/sidebar",
     "core/search"
 ], function($, storage, analytic, sharing, state, keyboard, exercise, quiz, progress, sidebar, search){
+    function changeNavigationPosition()
+    {
+        var bodyInnerWidth, pageWrapperWidth;
+        bodyInnerWidth = parseInt($('.body-inner').css('width'), 10);
+        pageWrapperWidth = parseInt($('.page-wrapper').css('width'), 10);
+        $('.navigation-next').css('margin-right', (bodyInnerWidth - pageWrapperWidth) + 'px');
+    }
+    $(window).on('resize', changeNavigationPosition);
     $(document).ready(function() {
-        var $book, bodyInnerWidth, pageWrapperWidth;
+        var $book;
         $book = state.$book;
 
         // Init sidebar
@@ -51,8 +59,6 @@ require([
         $(".book-body").focus();
 
         // Move, if needed, right navigation control to allow scrolling.
-        bodyInnerWidth = parseInt($('.body-inner').css('width'), 10);
-        pageWrapperWidth = parseInt($('.page-wrapper').css('width'), 10);
-        $('.navigation-next').css('margin-right', (bodyInnerWidth - pageWrapperWidth) + 'px');
+        changeNavigationPosition();
     });
 });