使用 jQuery animate() 增加/减少当前填充

Question

我正在尝试在悬停时增加/减少 div 的右填充（+= 和 -=），并且还想要一个动画效果。下面的代码正在完成这项工作，但没有动画。

    myDiv.mouseenter( function() {
      $(this).css({'padding-right' : '+=35px'});
    });

    myDiv.mouseleave( function() {
      $(this).css({'padding-right' : '-=35px'});
    });

P.s.，animate() 函数在值中使用“-=”或“+=”时会引发错误。

提前致谢！

Answer 1

当我检查时，以下代码在 Chrome 中运行良好......

<script> 
      $(document).ready(function () {
         var myDiv = $("#box");
         $("#box").mouseenter(function () {
            $(this).animate({
               'padding-right': '+=35px'
            }, 300)
         });

         $("#box").mouseleave(function () {
            $(this).animate({
               'padding-right': '-=35px'
            }, 300)
         });
        
      });
</script>

<div id="box" class="box" style="background-color:red; float:left">Test</div>