diff options
| author | Wu Cheng-Han | 2016-08-15 11:30:12 +0800 |
|---|---|---|
| committer | Wu Cheng-Han | 2016-08-15 11:30:12 +0800 |
| commit | 058c35730b3b8b0d3572c6e96093f760c402b727 (patch) | |
| tree | 43471e7ee449a7b304ffeb0de9f12cfc1aaad358 | |
| parent | 29d198def9e4d0c930625d646567e84cc81e512c (diff) | |
Update to hide scrollbar (but scrollable) in the slide mode
| -rw-r--r-- | public/css/slide.css | 19 | ||||
| -rw-r--r-- | public/js/slide.js | 4 | ||||
| -rw-r--r-- | public/views/slide.ejs | 49 |
3 files changed, 48 insertions, 24 deletions
diff --git a/public/css/slide.css b/public/css/slide.css index bccb7e42..3f79084b 100644 --- a/public/css/slide.css +++ b/public/css/slide.css @@ -280,6 +280,25 @@ pre.mermaid > svg { max-width: 758px; } +html, body { + height: 100%; + width: 100%; + overflow: hidden; +} + +.container { + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + overflow-y: scroll; +} + +.container.hidescrollbar { + right: -17px; +} + .reveal { height: 100vh; } diff --git a/public/js/slide.js b/public/js/slide.js index bdd8b3be..5b0f9bd0 100644 --- a/public/js/slide.js +++ b/public/js/slide.js @@ -110,3 +110,7 @@ Reveal.addEventListener('ready', function (event) { }, 0); }); Reveal.addEventListener('slidechanged', renderSlide); + +var isMacLike = navigator.platform.match(/(Mac|iPhone|iPod|iPad)/i) ? true : false; + +if (!isMacLike) $('.container').addClass('hidescrollbar'); diff --git a/public/views/slide.ejs b/public/views/slide.ejs index 5b728b21..3c5498c6 100644 --- a/public/views/slide.ejs +++ b/public/views/slide.ejs @@ -46,33 +46,34 @@ </script> </head> <body> + <div class="container"> + <div class="reveal"> + <div class="slides"><%- slides %></div> + </div> - <div class="reveal"> - <div class="slides"><%- slides %></div> - </div> - - <div id="meta" style="display: none;"><%- meta %></div> + <div id="meta" style="display: none;"><%- meta %></div> - <div class="footer"> - <div class="unselectable hidden-print" style="color: #777;"> - <small> - <span> - <% if(lastchangeuserprofile) { %> - <span class="ui-lastchangeuser"> <i class="ui-user-icon small" style="background-image: url(<%- lastchangeuserprofile.photo %>);" data-toggle="tooltip" data-placement="right" title="<%- lastchangeuserprofile.name %>"></i></span> - <% } else { %> - <span class="ui-no-lastchangeuser"> <i class="fa fa-clock-o"></i></span> - <% } %> - <span class="text-uppercase ui-status-lastchange"></span> - <span class="ui-lastchange text-uppercase" data-createtime="<%- createtime %>" data-updatetime="<%- updatetime %>"></span> - </span> - <span class="pull-right"><%- viewcount %> views <a href="#" class="ui-edit" title="Edit this note"><i class="fa fa-fw fa-pencil"></i></a></span> - </small> - </div> - <% if(typeof disqus !== 'undefined' && disqus) { %> - <div style="margin-top: 25px; margin-bottom: 15px;"> - <%- include disqus %> + <div class="footer"> + <div class="unselectable hidden-print" style="color: #777;"> + <small> + <span> + <% if(lastchangeuserprofile) { %> + <span class="ui-lastchangeuser"> <i class="ui-user-icon small" style="background-image: url(<%- lastchangeuserprofile.photo %>);" data-toggle="tooltip" data-placement="right" title="<%- lastchangeuserprofile.name %>"></i></span> + <% } else { %> + <span class="ui-no-lastchangeuser"> <i class="fa fa-clock-o"></i></span> + <% } %> + <span class="text-uppercase ui-status-lastchange"></span> + <span class="ui-lastchange text-uppercase" data-createtime="<%- createtime %>" data-updatetime="<%- updatetime %>"></span> + </span> + <span class="pull-right"><%- viewcount %> views <a href="#" class="ui-edit" title="Edit this note"><i class="fa fa-fw fa-pencil"></i></a></span> + </small> + </div> + <% if(typeof disqus !== 'undefined' && disqus) { %> + <div style="margin-top: 25px; margin-bottom: 15px;"> + <%- include disqus %> + </div> + <% } %> </div> - <% } %> </div> <script type="text/x-mathjax-config"> |