我一直在研究http://html5slides.googlecode.com/svn/trunk/template/index.html#1我想知道有没有可能修改这个代码，这样就可以有不止一行。
例如，现在它只左右滑动，但如果我想按下向下箭头向下？它会被带到一个单独的行，有单独的左/右导航等等
我一直在尝试这样做，但脚本计算了所有的<article>标记，并最终将它们放在一行中。
有没有人知道如何重述它，或者其他一些可以像上面描述的那样工作的脚本？其主要思想是最终形成一种可以使用箭头在所有方向上导航的网格。
function nextSlide() {
if (buildNextItem()) {
return;
}
if (curSlide < slideEls.length - 1) {
curSlide++;
updateSlides();
}
}
function prevSlide() {
if (curSlide > 0) {
curSlide--;
updateSlides();
}
}
function updateSlides() {
for (var i = 0; i < slideEls.length; i++) {
switch (i) {
case curSlide - 2:
updateSlideClass(i, 'far-past');
break;
case curSlide - 1:
updateSlideClass(i, 'past');
break;
case curSlide:
updateSlideClass(i, 'current');
break;
case curSlide + 1:
updateSlideClass(i, 'next');
break;
case curSlide + 2:
updateSlideClass(i, 'far-next');
break;
default:
updateSlideClass(i);
break;
}
}
triggerLeaveEvent(curSlide - 1);
triggerEnterEvent(curSlide);
window.setTimeout(function() {
// Hide after the slide
disableSlideFrames(curSlide - 2);
}, 301);
enableSlideFrames(curSlide - 1);
enableSlideFrames(curSlide + 2);
if (isChromeVoxActive()) {
speakAndSyncToNode(slideEls[curSlide]);
}
updateHash();
}
}
这些似乎是驱动幻灯片翻转的主要功能。没有原因您无法将其扩展到curSlideX和curSlideY并且使CCD_ 4根据两者中的哪一个改变而横向或垂直移动。
在html中您有
<section id=slides>
<atricle></article>
<atricle></article>
<atricle></article>
</section>
文章被赋予了动态类，以确定它们是大的，还是小的，放在一边。
您可以添加更多的行，增加更多的节，并让更新更改它们的类，就像文章类移动以适应选择的文章和行一样。