如何在CSS滑块中控制锚标签，以便它不会重新定位页面上的滚动？

Question

我正在尝试创建一个仅限CSS的滑块，我可以在页面上的多个实例中使用它。我使用锚标签来控制滚动，滑块完美地工作，但只是在真空中。

将它们放置在包含内容的页面上后，单击锚点（箭头）会滚动页面，直到该滑块位于顶部。这是不受欢迎的行为。有什么方法可以阻止这种情况发生吗？

它还“重置”另一个滑块。因此，例如，如果我已经部分滚动到第二个滑块，然后决定滚动第一个滑块，则第二个滑块返回到开头。这不像第一个问题那么严重，但如果有一个简单的解决方案，我很想知道它。

以下是测试的链接：http://nimbleforce.com/temp/slider/slider.html 这就是我正在使用的CSS：http://nimbleforce.com/temp/slider/sliderStyle.css

Answer 1

你提到你只想制作这个CSS，但是preventDefault是不可能的？

$("a[href='#']").on('click', function(event){
  event.preventDefault();
});

如果您觉得它们更舒服，请将"a[href='#']"更改为班级选择器。

我希望这就是你要找的东西。