Javascript 两个全宽div之间的滑块

我正在寻找一种拥有JavaScript/jQuery函数的方法，该函数可以用作函数上的完整页面滑块。我的HTML结构如下：

现在我想做两件事：

我希望slide1和slide2都是全宽元素。 此外，我需要一个函数，可以调用它来优雅地从slide1滑动到slide2，如果您再次调用它，则可以返回。 我在中找到了一个解决方案，但该代码有太多不必要的副作用，例如，没有垂直滚动；以内容为中心；没有平滑响应的字体大小调整，可以做更多的事情，因此使用了比我想要的更多的代码

---

我认为用较少的行数完成一定很容易，但我不知道如何去做。我希望有人能给我一些建议，告诉我如何制作两个全宽div，基本上是两个主体元素，在调用JavaScript/jQuery函数时可以滑动

简单jquery代码：

$( "#s1" ).click(function() {
  $("#s1").css("left","-100%");
  $("#s2").css("left","0");    
});

$( "#s2" ).click(function() {
  $("#s2").css("left","100%");
  $("#s1").css("left","0");    
});

---

这将使用css将div向左和向右滑动，并进行1s转换。

我不会太担心行数。fullPage.js它只有6Kb的压缩

它还提供了与旧浏览器IE 8+、Opera 12、no CSS3浏览器的兼容性…，可在触摸设备上检测触摸移动，提供URL锚，以及您想要的功能以及许多其他有用的功能

如果需要，可以禁用文本的垂直居中和调整大小。这些是可选的

---

不确定垂直滚动是什么意思，但您可以使用autoScrolling:false来完成类似的操作，其中包括水平滑动和正常的垂直滚动。

嗨，Alvaro，谢谢您的回答。我认为你和其他贡献者制作了一个非常好的产品。对于我目前的项目，它做得有点太多了，我正在寻找一个更简单的解决方案，可能是另一个当前的答案。很好，不用担心：Alvaro，你能告诉我如何使全页滑动页面上的内容朝向屏幕顶部吗？现在它已居中。好的，找到了解决方案：放置垂直居中：false:-。这似乎是我首选的解决方案。我会尽量在家里实施。谢谢，但立场：绝对；不幸的是，不适用于响应方。