按百分比对元素的最高位置进行动画处理

Question

我试图按百分比更改元素的位置，但是当鼠标悬停在元素上时什么也没有发生。我已经使用像素对其进行了测试，并且可以正常工作，因此类/ ID的名称不是问题：

$(document).ready(function() {
    $(".rightOption").mouseover(function(){
        $("#" + this.id).animate({top:'-100%'},1000);
    });
    $(".rightOption").mouseleave(function(){
        $("#" + this.id).animate({top:'0%'},1000);
    });
});