Velocity.js SVG的文本位置動畫

Question

我試圖讓Velocity.js動畫像這樣的SVG文本元素的位置：

Velocity(svg.getElementById('projects-title'), { 
    x: '50%', 
    y: '25%' 
    }); 

的問題是它的風格屬性改變這些值，而不是屬性本身。因此，不要改變元素的位置。由此產生的元素是：

<text x="50%" y="50%" id="projects-title" class="" style="x: 50%; y: 25%;">Projects</text> 

我該如何讓Velocity.js更改屬性而不是元素的CSS樣式？

Answer 1

試試這可能會有所幫助，您可以使用TweenMax庫輕鬆控制任何類型的屬性。

<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.19.0/TweenMax.min.js"></script> 
<script> 

    var tl = new TimelineMax(); 
    tl.set("#projects-title", { 
     x: '50%', 
     y: '25%' 
    }); 

</script>