Skip to content

Commit

Permalink
Add scrollfix for iOS
Browse files Browse the repository at this point in the history
  • Loading branch information
squidfunk committed Dec 29, 2016
1 parent 9edf730 commit 5ef3ec7
Showing 11 changed files with 30 additions and 11 deletions.

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion material/base.html
Original file line number Diff line number Diff line change
@@ -110,7 +110,7 @@ <h1>{{ page.title | default(config.site_name, true)}}</h1>
<script src="https://cdn.mathjax.org/{{ path }}"></script>
{% endif %}
{% endfor %}
<script src="{{ base_url }}/assets/javascripts/application-f33e110d6b.js"></script>
<script src="{{ base_url }}/assets/javascripts/application-2442e71194.js"></script>
<script>var config={url:{base:"{{ base_url }}"}},app=new Application(config);app.initialize()</script>
{% for path in extra_javascript %}
<script src="{{ path }}"></script>
2 changes: 1 addition & 1 deletion material/partials/nav-item.html
Original file line number Diff line number Diff line change
@@ -12,7 +12,7 @@
<label class="md-nav__title" for="{{ path }}">
{{ nav_item.title}}
</label>
<ul class="md-nav__list">
<ul class="md-nav__list" data-md-scrollfix>
{% for nav_item in nav_item.children %}
{% set temp = path %}
{% set path = path + "-" + loop.index | string %}
2 changes: 1 addition & 1 deletion material/partials/nav.html
Original file line number Diff line number Diff line change
@@ -14,7 +14,7 @@
{% include "partials/source.html" %}
</div>
{% endif %}
<ul class="md-nav__list">
<ul class="md-nav__list" data-md-scrollfix>
{% for nav_item in nav %}
{% set path = "nav-" + loop.index | string %}
{% include "partials/nav-item.html" %}
2 changes: 1 addition & 1 deletion material/partials/search.html
Original file line number Diff line number Diff line change
@@ -6,7 +6,7 @@
<label class="md-icon md-search__icon" for="search"></label>
</form>
<div class="md-search__output">
<div class="md-search__scrollwrap">
<div class="md-search__scrollwrap" data-md-scrollfix>
<div class="md-search-result" data-md-component="result"></div>
</div>
</div>
2 changes: 1 addition & 1 deletion material/partials/toc.html
Original file line number Diff line number Diff line change
@@ -5,7 +5,7 @@
{% endif %}
{% if toc and (toc | first) %}
<label class="md-nav__title" for="toc">Table of contents</label>
<ul class="md-nav__list">
<ul class="md-nav__list" data-md-scrollfix>
{% for toc_item in toc %}
{% include "partials/toc-item.html" %}
{% endfor %}
19 changes: 19 additions & 0 deletions src/assets/javascripts/application.js
Original file line number Diff line number Diff line change
@@ -72,6 +72,25 @@ export default class Application {
}
wrap.appendChild(table)
})

/* Force 1px scroll offset to trigger overflow scrolling */
if (Modernizr.ios) {
const scrollable = document.querySelectorAll("[data-md-scrollfix]")
Array.prototype.forEach.call(scrollable, item => {
item.addEventListener("touchstart", () => {
const top = item.scrollTop

/* We're at the top of the container */
if (top === 0) {
item.scrollTop = 1

/* We're at the bottom of the container */
} else if (top + item.offsetHeight === item.scrollHeight) {
item.scrollTop = top - 1
}
})
})
}
}).listen()

/* Component: sidebar container */
2 changes: 1 addition & 1 deletion src/partials/nav-item.html
Original file line number Diff line number Diff line change
@@ -41,7 +41,7 @@
<label class="md-nav__title" for="{{ path }}">
{{ nav_item.title}}
</label>
<ul class="md-nav__list">
<ul class="md-nav__list" data-md-scrollfix>

<!-- Render nested item list -->
{% for nav_item in nav_item.children %}
2 changes: 1 addition & 1 deletion src/partials/nav.html
Original file line number Diff line number Diff line change
@@ -38,7 +38,7 @@
{% include "partials/source.html" %}
</div>
{% endif %}
<ul class="md-nav__list">
<ul class="md-nav__list" data-md-scrollfix>
{% for nav_item in nav %}
{% set path = "nav-" + loop.index | string %}
{% include "partials/nav-item.html" %}
2 changes: 1 addition & 1 deletion src/partials/search.html
Original file line number Diff line number Diff line change
@@ -31,7 +31,7 @@
<label class="md-icon md-search__icon" for="search"></label>
</form>
<div class="md-search__output">
<div class="md-search__scrollwrap">
<div class="md-search__scrollwrap" data-md-scrollfix>
<div class="md-search-result" data-md-component="result"></div>
</div>
</div>
2 changes: 1 addition & 1 deletion src/partials/toc.html
Original file line number Diff line number Diff line change
@@ -37,7 +37,7 @@
<!-- Render item list -->
{% if toc and (toc | first) %}
<label class="md-nav__title" for="toc">Table of contents</label>
<ul class="md-nav__list">
<ul class="md-nav__list" data-md-scrollfix>
{% for toc_item in toc %}
{% include "partials/toc-item.html" %}
{% endfor %}

0 comments on commit 5ef3ec7

Please sign in to comment.