diff options
| -rw-r--r-- | css/read.css | 13 | ||||
| -rw-r--r-- | js/read.js | 38 | ||||
| -rw-r--r-- | read.html | 5 |
3 files changed, 33 insertions, 23 deletions
diff --git a/css/read.css b/css/read.css index 5f49126..d1cb1be 100644 --- a/css/read.css +++ b/css/read.css @@ -71,6 +71,19 @@ left : 32px; right : 32px; } +#left, #right { + position : absolute; + top : 32px; + bottom : 32px; + width : 0px; + z-index : 10; +} +#left { + left : 0px; +} +#right { + right : 0px; +} @media (max-width: 992px) { .toolbar { @@ -117,36 +117,28 @@ function hotkey_handler(e) { } } -$(document).ready(function() { - document.onkeydown = hotkey_handler; +function resize_side_columns() { + var width = $("#reader").position().left; - $(window).on("mouseup", function(evt) { - if (evt.button == 0) { + var iframe = $("#reader iframe")[0]; - if ($(".modal").is(":visible")) - return; + if (iframe && iframe.contentWindow.$) + width += parseInt(iframe.contentWindow.$("body").css("padding-left"), 10); - var reader = $("#reader"); - var doc = $(document); - var margin_side = parseInt(reader.css("left"), 10); - var margin_top = parseInt(reader.css("top"), 10); - var margin_bottom = parseInt(reader.css("bottom"), 10); + $("#left, #right").width(width); +} - //console.log(margin_side, margin_top, margin_bottom); +$(document).ready(function() { + document.onkeydown = hotkey_handler; - if (evt.clientY < margin_top || evt.clientY >= doc.height() - margin_bottom) { - return; - } + $("#left").on("mouseup", function(evt) { + prev_page(); + }); - if (evt.clientX >= doc.width() - margin_side) { - console.log("RIGHT SIDE"); - next_page(); - } else if (evt.clientX <= margin_side) { - console.log("LEFT SIDE"); - prev_page(); - } - } + $("#right").on("mouseup", function(evt) { + next_page(); }); + }); function apply_line_height(elem) { @@ -214,6 +214,9 @@ </div> </div> +<div id="left"></div> +<div id="right"></div> + <div id="reader"></div> <div class="loading"> @@ -721,6 +724,8 @@ rendition.on('rendered', function(chapter) { $(".chapter").html($("<span>").addClass("glyphicon glyphicon-th-list")); + resize_side_columns(); + try { var location = book.rendition.currentLocation(); |