html5演示文稿
问题描述:
我一直在寻找http://html5slides.googlecode.com/svn/trunk/template/index.html#1,并想知道是否可以修改此代码,以便可能不止一行。html5演示文稿
例如,现在它只能左右滑动,但如果我想按下向下箭头按下按钮?这将需要单独的左/右导航等单独行等等。
我一直在试图做到这一点,但脚本统计了所有<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
,并且updateSlide
可以横向或纵向移动,具体取决于两者中的哪一个发生了变化。
你有
<section id=slides>
<atricle></article>
<atricle></article>
<atricle></article>
</section>
与物品被赋予动态类,以确定是否是大或变小,到一边。
您可以按更多节添加更多行,并使更新改变其类的方式与文章类四处移动以适应选定的文章和行相同。
谢谢@gbtimmon的回答。从理论上讲,我可以看到你在这里做什么,但事实证明,这是高于我的头,我缺乏这种编程技能。 所以,如果有人能够帮助我进一步修改这个脚本,我会非常感激,尽管我意识到这是一个非常天真的请求;-) – Tomarz 2012-07-13 10:58:26