如何使圆形菜单可滚动

Question

我正在构建一个ionic2应用程序，我有一个类似于codepen的菜单。我已经为它设置了一个圆形动画。如何使这个圆形菜单以圆形方式滚动。谢谢

HTML

<div class='selector'>
<ul>
    <li>
      <input id='1' type='checkbox'>
      <label for='1'>Option 1</label>
    </li>
    <li>
      <input id='2' type='checkbox'>
      <label for='2'>Option 2</label>
    </li>
    <li>
      <input id='3' type='checkbox'>
      <label for='3'>Option 3</label>
    </li>
  </ul>
  <button>Click here</button>
</div>

JS

var angleStart = -360;
// jquery rotate animation
function rotate(li,d) {
    $({d:angleStart}).animate({d:d}, {
        step: function(now) {
            $(li)
               .css({ transform: 'rotate('+now+'deg)' })
               .find('label')
                  .css({ transform: 'rotate('+(-now)+'deg)' });
        }, duration: 0
    });
}

// show / hide the options
function toggleOptions(s) {
    $(s).toggleClass('open');
    var li = $(s).find('li');
    var deg = $(s).hasClass('half') ? 180/(li.length-1) : 360/li.length;
    for(var i=0; i<li.length; i++) {
        var d = $(s).hasClass('half') ? (i*deg)-90 : i*deg;
        $(s).hasClass('open') ? rotate(li[i],d) : rotate(li[i],angleStart);
    }
}

$('.selector button').click(function(e) {
    toggleOptions($(this).parent());
});

setTimeout(function() { toggleOptions('.selector'); }, 100);

关注codepen链接。