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)
这有点像黑客,但它确实有效。将滚动条的高度(在本例中为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)