Jquery 为什么向下滚动时无法绘制此SVG?我在用skrollr

Jquery 为什么向下滚动时无法绘制此SVG?我在用skrollr,jquery,skrollr,Jquery,Skrollr,第一站在这里 我遵循了skrollr(jquery)中的一个示例,在该示例中,您可以在向下滚动时绘制SVG路径 问题是,它适用于第一个SVG和我复制粘贴的第一个SVG(现在位于底部),但现在当我尝试更改其中任何一个SVG时,滚动功能都不起作用,就像站点的第二部分一样。我不知道我做错了什么 我用它和超级图像来淡化文本(也许不是最好的解决方案,但我还在学习) 谢谢你 范例 这很有效 ` Lorem ipsum dolor sit amet,奉献精英 而这个不起作用。唯一的区别是路径,但即使我从

第一站在这里

我遵循了skrollr(jquery)中的一个示例,在该示例中,您可以在向下滚动时绘制SVG路径

问题是,它适用于第一个SVG和我复制粘贴的第一个SVG(现在位于底部),但现在当我尝试更改其中任何一个SVG时,滚动功能都不起作用,就像站点的第二部分一样。我不知道我做错了什么

我用它和超级图像来淡化文本(也许不是最好的解决方案,但我还在学习)

谢谢你

范例

这很有效 `


Lorem ipsum dolor sit amet,奉献精英
而这个不起作用。唯一的区别是路径,但即使我从上面复制路径,向下滚动时也无法设置动画

<div class="bloque2">
             <h2 id="fade-it1"> <b>¿De qué sirven si carecen de emoción?</b></h2> 
        <svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="300px" height="300px">
            <path
                style="fill:none;stroke:#fff;stroke-width:5;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:6000;stroke-dashoffset:0"
                data-0="stroke-dashoffset:6000;" data-end="stroke-dashoffset:0;"

                d="M240.9,102.4c-3.5-8.3-8.8-15.3-15.8-20.9c-8-6.4-17.1-10.1-27.1-11.1
    c-6.5-0.6-13,0-19.3,1.9c-11,3.3-20,9.7-27,19.1c-0.6,0.9-1.3,1.8-2,2.8c-8-11.5-18.5-19.1-31.9-22c-13.4-3-26-0.7-37.8,6.4
    c0.2,0.4,0.4,0.7,0.5,0.9c-1-0.9-1.7-0.2-2.4,0.4c-0.9,0.7-1.9,1.2-2.7,2c-2.3,2-4.6,4.1-6.7,6.3c-3.8,4-6.8,8.7-9.1,13.7
    c-2.4,5.3-3.9,10.9-4.6,16.8c-0.8,7,0,13.8,2.1,20.4c2.3,7,5.4,13.5,9.1,19.8c5.7,9.6,12.6,18.4,20.1,26.6
    c7.9,8.6,16.6,16.4,25.8,23.5c11.9,9.1,24.5,17,37.9,23.4c0.3,0.2,0.9,0.1,1.2,0c2.5-1.4,5-2.9,7.5-4.4
    c14.6-8.7,28.4-18.7,41.1-30.2c11.4-10.3,21.8-21.6,30.4-34.5c4.7-7,8.7-14.4,11.6-22.5c1.7-4.7,2.9-9.5,3.2-14.5
    C245.6,118,244.1,110,240.9,102.4z M156.8,145.3l0.2,28l-13.3,0.1l-0.2-28c-3-2.1-5-5.6-5.1-9.5c0-6.4,5.1-11.7,11.6-11.8
    c6.4,0,11.7,5.1,11.8,11.6C161.8,139.7,159.8,143.2,156.8,145.3z"
            />
        </svg>
        </div><!--endofbloque2 div-->

你是说埃莫西翁的事业如何?

如果有人感兴趣,解决方法是根据每条路径的长度调整笔划dasharray和笔划dashoffset


感谢skrollr的创建者Alexander Prinzhorn。

也许可以发布一个包含该问题的代码示例?问题是我看不出代码中有什么错误:/第一个SVG工作得很好,第二个SVG写得几乎一样,但不工作。我想知道我错过了什么。
<div class="bloque2">
             <h2 id="fade-it1"> <b>¿De qué sirven si carecen de emoción?</b></h2> 
        <svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="300px" height="300px">
            <path
                style="fill:none;stroke:#fff;stroke-width:5;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:6000;stroke-dashoffset:0"
                data-0="stroke-dashoffset:6000;" data-end="stroke-dashoffset:0;"

                d="M240.9,102.4c-3.5-8.3-8.8-15.3-15.8-20.9c-8-6.4-17.1-10.1-27.1-11.1
    c-6.5-0.6-13,0-19.3,1.9c-11,3.3-20,9.7-27,19.1c-0.6,0.9-1.3,1.8-2,2.8c-8-11.5-18.5-19.1-31.9-22c-13.4-3-26-0.7-37.8,6.4
    c0.2,0.4,0.4,0.7,0.5,0.9c-1-0.9-1.7-0.2-2.4,0.4c-0.9,0.7-1.9,1.2-2.7,2c-2.3,2-4.6,4.1-6.7,6.3c-3.8,4-6.8,8.7-9.1,13.7
    c-2.4,5.3-3.9,10.9-4.6,16.8c-0.8,7,0,13.8,2.1,20.4c2.3,7,5.4,13.5,9.1,19.8c5.7,9.6,12.6,18.4,20.1,26.6
    c7.9,8.6,16.6,16.4,25.8,23.5c11.9,9.1,24.5,17,37.9,23.4c0.3,0.2,0.9,0.1,1.2,0c2.5-1.4,5-2.9,7.5-4.4
    c14.6-8.7,28.4-18.7,41.1-30.2c11.4-10.3,21.8-21.6,30.4-34.5c4.7-7,8.7-14.4,11.6-22.5c1.7-4.7,2.9-9.5,3.2-14.5
    C245.6,118,244.1,110,240.9,102.4z M156.8,145.3l0.2,28l-13.3,0.1l-0.2-28c-3-2.1-5-5.6-5.1-9.5c0-6.4,5.1-11.7,11.6-11.8
    c6.4,0,11.7,5.1,11.8,11.6C161.8,139.7,159.8,143.2,156.8,145.3z"
            />
        </svg>
        </div><!--endofbloque2 div-->