Update inner navigation code.

Closes issues #4 and #58.
This commit is contained in:
Oleg Roschupkin 2012-03-01 14:05:43 +09:00
parent 9addbae918
commit 6f2d2f337e
3 changed files with 15 additions and 15 deletions

10
en.htm
View File

@ -176,11 +176,11 @@
<header> <header>
<h2>Inner Navigation</h2> <h2>Inner Navigation</h2>
</header> </header>
<ol class="inner"> <ol>
<li class="active">This tool is provided</li> <li>This tool is provided</li>
<li>Without warranty, guarantee</li> <li class="next">Without warranty, guarantee</li>
<li>Or much in the way of explanation <li class="next">Or much in the way of explanation
<li>Erase your hard drive.</li> <li class="next">Erase your hard drive.</li>
</ol> </ol>
</section> </section>
</div></div> </div></div>

View File

@ -9,7 +9,7 @@
for (i = 0; i < l; i++) { for (i = 0; i < l; i++) {
slideList.push({ slideList.push({
id: slides[i].id, id: slides[i].id,
hasInnerNavigation: null !== slides[i].querySelector('.inner') hasInnerNavigation: null !== slides[i].querySelector('.next')
}); });
} }
@ -127,13 +127,13 @@
// Shortcut for slides without inner navigation // Shortcut for slides without inner navigation
if (true !== slideList[slideNumber].hasInnerNavigation) { return -1; } if (true !== slideList[slideNumber].hasInnerNavigation) { return -1; }
var activeNodes = document.querySelectorAll(getSlideHash(slideNumber) + ' .active'), var nextNodes = document.querySelectorAll(getSlideHash(slideNumber) + ' .next:not(.active)'),
// NOTE: we assume there is no other elements in inner navigation node;
node = activeNodes[activeNodes.length - 1].nextElementSibling;
if (null !== node) { if (0 !== nextNodes.length) {
node = nextNodes[0];
node.classList.add('active'); node.classList.add('active');
return activeNodes.length + 1; return nextNodes.length - 1;
} else { } else {
return -1; return -1;
} }

View File

@ -394,10 +394,10 @@ BODY {
} }
/* Inner Navigation */ /* Inner Navigation */
.full .inner > * { .full .next {
opacity:0; opacity:0;
} }
.full .inner > .active { .full .next.active {
opacity:1; opacity:1;
-webkit-transition:opacity 0.5s linear; -webkit-transition:opacity 0.5s linear;
-moz-transition:opacity 0.5s linear; -moz-transition:opacity 0.5s linear;