carouFredSel:显示部分商品?

col*_*unn 5 html javascript css jquery caroufredsel

我正在使用carouFredSel创建一个垂直旋转木马.一切都很好,除了我希望部分项目显示在底部,裁剪,而不是隐藏.这样,它将向用户指示可以滚动的其他项目.

我一直在阅读文档,但到目前为止还无法判断我所追求的是否可行.

看看JSFiddle,看看我的意思.观看页面上最底部的项目.

使用Javascript

$("ul").carouFredSel({
    direction: "up",
    align: "top",
    width: 100,
    height: "100%",
    items: {
        visible: "variable",
        width: 100,
        height: "variable"
    },
    scroll: {
        items: 1,
        mousewheel: true,
        easing: "swing",
        duration: 500
    },
    auto: false,
    prev: {
        button: ".prev",
        key: "up"
    },
    next: {
        button: ".next",
        key: "down"
    }
});?
Run Code Online (Sandbox Code Playgroud)

col*_*unn 4

这有点像黑客,但它确实有效。将滚动条的高度(在本例中为ul)设置为 150%,将父元素(在本例中为body)设置为overflow: hidden。现在最底部的元素已离开屏幕。

JavaScript

$("ul").carouFredSel({
    height: "150%"
});
Run Code Online (Sandbox Code Playgroud)

CSS

body {
    overflow: hidden;
    }
Run Code Online (Sandbox Code Playgroud)