2

我希望能够将自定义箭头按钮链接到 Nicescroll 脚本，以便在有人单击向上/向下按钮时发生滚动（除了已经存在的现有按键和鼠标滚轮滚动功能）。

关于如何做到这一点的任何想法？（对不起，我对 jquery 不是很好）

谢谢

4

3 回答 3

3

我回答这个问题有点晚了，但这可能对其他人有用。

您可以通过更改使用nicescroll的容器的滚动顶部来实现此目的。Nicescroll 会自动更改滚动条，因此您不必担心。

例如：

$(ARROW).click(function () { $(SCROLLCONTAINER).scrollTop($(SCROLLCONTAINER).scrollTop() + 50); });

如果您想在用户按住时继续滚动，您可以使用 keydown 并使用间隔更改 scrolltop 的值，并在 keyup 时清除该间隔。

希望这可以帮助。

于 2013-11-13T09:13:50.683 回答
1

我知道这有点晚了，但我一直在寻找解决同一问题的方法，最终我得到了这个，在我的情况下效果很好：

    var scrolled=0;

jQuery("#scroll-down").on("click" , function(){
    scrolled=scrolled+100;
    jQuery("#main").animate({
        scrollTop:  scrolled
    });
}); 
jQuery("#scroll-up").on("click" , function(){
    scrolled=scrolled-100;
    jQuery("#main").animate({
        scrollTop: scrolled
    });
});

将#scroll-down、#scroll-up 和#main 替换为您自己的ID。通过更改 100，您可以调整每次单击时滚动的距离

于 2013-12-17T21:29:22.370 回答
1

在 niceScroll 对象中找到这一行：

rail.append(cursor);

并将其替换为：

var cursor_wrapper = $(document.createElement('div'));
cursor_wrapper.css({width: '100%', height: '100%'});
cursor_wrapper.addClass('cursor-wrapper');
rail.append(cursor_wrapper);
cursor_wrapper.append(cursor);

然后添加css：

.nicescroll-rails{
    background: url('../img/scroll-top-arrow.png') no-repeat center top;
}
.cursor-wrapper{
    background: url('../img/scroll-bottom-arrow.png') no-repeat center bottom;
    cursor: pointer;
}

这不是最好的解决方案，但它适用于垂直滚动......

于 2013-11-13T13:48:42.203 回答