javascript - JavaScript-模拟转盘/UIPicker

我在讨论一些方法来模拟“价格是正确的”类型轮或样式UIPicker功能。
也就是说，我不需要从一个UIPicker插件的整个对话框和配色方案。我只需要能够通过几个图像动画复制一个轮子的旋转。
举个例子来说，这是我的列表：
一千九百八十四
一千九百八十五
一千九百八十七
一千九百九十
一千九百九十四
假设这些数字出现在屏幕上：
一千九百八十五
一千九百八十七
一千九百九十
当用户点击1990时，列表会从屏幕上滑出1985，而1994则出现在屏幕上。留给我们的是：
一千九百八十七
一千九百九十
一千九百九十四
然后当用户单击1994时，列表再次向上滑动，1987离开屏幕，1984进入屏幕。或者列表也可以向下滑动。。。那么，实现这一目标的首选方法是什么？我已经讨论过每个组合的一个infinite scroller和一组超大图像（将在较小的div中以限制其在屏幕上的部分），这些图像可以上下滑动，然后换成新的组合，并为下一个选择做好准备。

最佳答案

我想有好几种方法可以成功地做到这一点。就我个人而言，jQuery animate上有一个回调函数，它使用insertAfter获取第一个项并将其追加到末尾，同时还修改列表的相对位置这是可行的，只是几行代码，但这取决于您希望它有多平滑。
类似于：

var $length = $('.list li').length--;
$('#foo').click(function(){
    $('.list').animate({
        top:'-30px'
    },function(){
        $('.list li').eq(0).insertAfter($('.list li').eq($length));
        $('.list').css('top','0px');
    });
});

很管用，但这是我脑子里想出来的，也许有一种更顺畅的方法。

关于javascript - JavaScript-模拟转盘/UIPicker，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/12567762/