CarouFredSel: Show partial items?

Question

I use carouFredSel to create a vertical carousel. Everything works fine, except that I prefer that partial objects appear below, clipped rather than hidden. Thus, this indicates to users that there are additional elements that can be scrolled.

I read the documentation , but I still can’t say if it’s possible that I am behind it.

Take a look at JSFiddle to see what I mean . See the bottommost item on the page.

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"
    }
});​

Answer 1

, . ( , ul) 150%, ( , body) - overflow: hidden. .

Javascript

$("ul").carouFredSel({
    height: "150%"
});

CSS

body {
    overflow: hidden;
    }

Answer 2

, caroufredsel , :))! :

items: {
    visible: '+1'
}

: , , . + 1 == , , . , , , minimum: 1, (, , , , .).

Answer 3

. :

function cropCarousel () {
    var visibleElements = this.triggerHandler("currentVisible"), // show all visible
    $lastElement = $(visibleElements[visibleElements.length - 1]); // get the last one

    $lastElement.css('margin-bottom', '30px'); // amend the margin
};

cropCarousel.call($('#your_carousel_id'));

, init . ;)