基于圆圈的列表在拖放和拖动中响应

Question

我有以下拖放和拖动设置正在工作如何修复列表图标的大小，因此当浏览器较小（平板电脑/移动设备）时，项目不像桌面那样均匀地进行播放。

我怎样才能改变尺寸百分比？

完整的代码在jsfiddle：http://jsfiddle.net/elogicmedia/rKUkF/4/

上进行了演示

三江源

JS

    circle_radius = 200;
$links = $('nav ul.gallery li a');
total_links = $links.size();
$links.each(function(index) {
    $(this).attr('data-index',index);
    animateCircle($(this), 1);
});
$('ul.gallery > li a').hover(function() {
    animateCircle($(this), 1.1);
}, function() {
    animateCircle($(this), 1);

});

function animateCircle($link, expansion_scale) {
    index = $link.attr('data-index');
    radians = 2*Math.PI*(index/total_links);
    x = -(Math.sin(radians)*circle_radius*expansion_scale);
    y = -(Math.cos(radians)*circle_radius*expansion_scale);
    $link.animate({
        top: x+'px',
        left: y+'px'
    }, 200);
}

CSS

a {
position: absolute;
text-decoration: none;
width:98px;
height:98px;
border-radius:50%;
line-height:1.5em;
text-align:center;
font-family: helvetica, arial;
background-color: #C0D9D9;

}