jQuery SmoothScroll和Select-Option

Question

我正在创建一个选择菜单，以使我的网站具有响应能力。 我正在使用smoothscroll（ https://github.com/kswedberg/jquery-smooth-scroll ）处理常规的href #hash链接菜单项的滚动，但是可以使用一些帮助使其在select＆option中起作用。

这是我的选择菜单；

<select>   
    <option value=""> </option>
    <option value="#home" class="smoothscroll">Home</option>
    <option value="#what-we-do" class="smoothscroll">What we do</option>
    <option value="#case-studies" class="smoothscroll">Case Studies</option>
    <option value="#testimonials" class="smoothscroll">Testimonials</option>
    <option value="#contact" class="smoothscroll">Contact</option>
</select>

这是我的jQuery代码；

$('nav select').change(function() {
    $.smoothScroll({offset: -70, speed: 2000});
});

现在，如果您向下滚动我的页面并使用选择菜单并选择任何选项，它将平滑地滚动回到页面顶部-而不是正确的#hash标签。 如果您在页面顶部时选择一个选项，则不会发生任何事情。

您的帮助将不胜感激。 谢谢。

Answer 1

在我看来，您实际上并没有告诉Smoothscroll您想去的地方。 根据文档，您可以像下面这样使用scrollTarget简单地给函数指定目标（其中$(this).val()是select元素的当前值）：

$('nav select').change(function() {
    $.smoothScroll({
        offset: -70,
        speed: 2000,
        scrollTarget: $(this).val()
    });
});