要素のオフセットは「未定義」を返します。

Question

の子であるsvg#cta-scrollイメージを持っています。 svgのoffsetTop（または他の種類のオフセット）を取得しようとするたびに、常にundefined（Chrome、OS X）が返されます。ここ

(function hideCtaWelcomeOnScroll() { 
    var ctaWelcomeElement = document.getElementById('cta-scroll'); 
    var initialCtaWelcomeOffset = ctaWelcomeElement.offsetTop; 
})(); 

initialCtaWelcomeOffset常にundefinedを返します。

何が起こっているのでしょうか？

編集：私はそれがはるかに役立つと思いますが、ここでsvgためのCSSですません。

#cta-scroll 
    width: 2vw 
    display: block 
    fill: white 
    margin-left: -1vw 
    position: absolute 
    bottom: 7vh 
    left: 50% 
    z-index: 10 
    animation: ctaScroll 10s infinite 

絶望の行為で、私は、アニメーションやポジショニングを削除しようとしたが、それはしていません変更するもの...

Answer 1

SVG要素はoffsetTopプロパティをサポートしていないので、divのSVGをラッピングして、代わりにその要素のオフセットを取得することをお勧めします。

(function hideCtaWelcomeOnScroll() { 
    var ctaWelcomeElement = document.getElementById('svgWrapper'); 
    var initialCtaWelcomeOffset = ctaWelcomeElement.offsetTop; 
})(); 

HTML：

<div id="svgWrapper"> 
    <svg></svg> 
</div>