一个单页网站,其工作方式类似于幻灯片

时间:2014-07-14 08:48:36

标签: javascript html asp.net web responsive-design

这是what I am trying to replicate

这是一个单页网站。你导航"向下"使用键盘,鼠标,鼠标滚动或滑动。还有一些左/右导航的旋转木马。每个"幻灯片"适合折叠的全高页面。但是所有幻灯片仍然只是一个HTML文档。

我可以尝试使用自定义代码重新创建它,但是,有许多问题,例如检测屏幕大小,粘性页脚,填充屏幕空间,图像大小调整等。

肯定有一个插件可以做到这一点,或者可能是一个很好的教程,样本......或者"某些东西"?我使用的是ASP.NET-MVC,但通用的解决方案也是一个很好的起点!

更新以安抚"过于宽泛的问题"编辑:
- 如何检测到滑动结束时到达? - > jQuery Waypoints插件
- 如何滚动到下一个"幻灯片"?我假设像jQuery scrollTo插件一样? - 我如何进行左/右导航?
- 如何使用该示例中的动画左/右和上/下移动幻灯片?
- 如何书签/跳转到页面内链接(触发转到某个幻灯片)

1 个答案:

答案 0 :(得分:2)

它被称为Parallax Scrolling技术。

Tutorial Simple version

幻灯片放映称为Carusel(如果你在ASP .NET MVC中使用默认的boostrap)。

您可以制作自己的单页应用程序。 您可以see这些网站。