有多个可见项目的jquery滚动条

滚动条内的项目是display:inline-block，并且在任何给定时间在x和y平面中可以有多个项目可见。

任何人都可以帮助我的滚动？

这是一个jsfiddle我目前有。动画滑动不起作用。我试图让所有的内容包装的外面一起滑动，同时项目的下一个页面中滑动。

if (~~ (counter/totalVisible) == currentPage) { 
    item.show(); 
    item.animate({ 
     "left": -(item.position().left) 
    }); 
} else { 
    item.animate({ 
     "left": -(item.position().left) 
    }); 
    item.hide(); 
}

来源

2013-08-17 Geoff

那么，重新发明轮子？考虑使用：http://rocha.la/jQuery-slimScroll – diosney

我知道有一百万个滚动条可用。我有更多的功能比标准的，这就是为什么我创建一个自定义滚动。 – Geoff

Okey，很高兴知道:) – diosney

如果你想动画的位置，在你的CSS，你必须给你正在尝试动画position: relative;属性的元素。

考虑一个简单的例子，当我点击文档页面时，我想要一个块向右移动。

Codepen素描：http://cdpn.io/vdCth

HTML

<div class='item'></div>

CSS

.item { 
    background: #ccc; 
    display: inline-block; 
    height: 50px; 
    position: relative; 
    width: 50px; 
}

jQuery的

$('html').on('click', function(){ 
    $('.item').animate({ 
    left: "+=50" 
    }, 200, function(){ 
    }); 
});

现在从你的CSS删除position: relative;，你会看到动画不再出现，因为在这个叉证明：http://cdpn.io/LcakK

希望有所帮助。

来源

2013-08-17 22:39:13 kunalbhat

有多个可见项目的jquery滚动条

回答

相关问题