2017-06-05 8 views
0

私は自分のウェブサイトで視差効果を作成しようとしていますが、main sourceからの説明通りに正確に指示に従っていますが、まだ動作していません。コードスニペットは次のとおりです。ステラjsは動作しません

HTML

<div id="home-section" data-stellar-background-ratio="0.5"></div> 
<div id="site"></div> 

CSS

#home-section { 
    background-image: url(inspiration.jpg); 
    background-size: cover; 
    background-repeat: no-repeat; 
    background-attachment: fixed; 
    width: 100%; 
    height: 100vh; 
    position: relative; 
} 
#site { 
    height: 4000px; 
    width: 100%; 
    position: relative; 
} 

JQ

<script src="js/jquery-3.1.1.js"></script> 
<script src="js/jquery.stellar.min.js"></script> 
<script> 
$.stellar(); 
</script> 

ここcodepenです。

答えて

0

これ以上サポートされないため、ステラはjQuery3.xで使用することはできません。あなたは、あなたのdevのツールのコンソール(またはこれに似たもの)に投げ、次のエラーが表示されるはずです。

Uncaught TypeError: f.getClientRects is not a function

jQueryの2.xののバージョンを使用して、さらに変更せずに動作します。

+0

これはうまくいきませんでした。 –

+0

直面している問題を示すCodePen、JsFiddle、またはStack Snippetを作成してください。 –

+0

コードが追加されました。 –

関連する問題