Javascript 字母列表选择器，如支持HTML5和jQuery滑动的iOS

我想用一个类似iOS的列表栏来制作一个列表，但我做不到。我创建了一个按字母顺序排列的列表，即：

<div class="content">
   <ul class="alphabetical-list">
       <li class="a"></li>
       <li class="b"></li>
       <li class="c"></li>
       ...
   </ul>
</div>
<div id="linkbar">
  <ul class="alphabetical">
     <li>A</li>
     <li>B</li>
     <li>C</li>
     <li>...</li>
     <li>X</li>
     <li>Y</li>
     <li>Z</li>
  </ul>
</div>

我有一个收割台处于绝对位置，高度为100px。我试着控制如下：

var anima = 0;
var old = 0;
function animate(touchHeight){
    old = anima;
    if(touchHeight > 105 && touchHeight < 130) {
        anima = $(".a").offset().top-100;
    }
    if(touchHeight > 130 && touchHeight < 155) {
        anima = $(".b").offset().top-100;
    }
    if(touchHeight > 155 && touchHeight < 180) {
        anima = $(".c").offset().top-100;
    }
    ...
    if(touchHeight > 650 && touchHeight < 675) {
        anima = $(".x").offset().top-100;
    }
    if(touchHeight > 675 && touchHeight < 700) {
        anima = $(".y").offset().top-100;
    }
    if(touchHeight > 700 && touchHeight < 725) {
        anima = $(".z").offset().top-100;
    }
    anima = anima + old;    
    $('.content').animate({scrollTop: anima},500);
}

$(".alphabetical").touchmove(function(e){
    touchHeight = e.originalEvent.touches[0].pageY;;
    animate(touchHeight);
});

但它不起作用，因为列表的内容来自JSON

---

即使在加载内容后启动函数，当我试图通过滑动屏幕实例化动画时，脚本似乎也会出错。

Define not working。会发生什么，会是什么样子？发生了什么情况？当用户触摸该栏时，内容应放在所选字母中。像锚一样。但是如果我滑动该条，选择器必须根据所选字母表的字母跟随。如本机iOS联系人列表中的字母栏所示。所以不起作用，当我刷alhabetic栏，而不是选择的字母，内容去不同的点。