simplePARALLAX.js
まずは実装サンプルを確認
ファイルの読み込み
/templates/footer.htmlに以下のソースを張り付ける。
<script src="https://cdn.jsdelivr.net/npm/simple-parallax-js@5.5.1/dist/simpleParallax.min.js"></script>
javascriptの記載
/templates/footer.htmlに以下を張り付ける。また、オプションは公式サイトをご覧ください。
<script>
var image = document.getElementsByClassName('thumbnail');
new simpleParallax(image, {
delay: '3.0',
scale: '1.5'
});
</script>
htmlの記述
divタグなどを入れずに、imgタグだけで記述します。divタグが自動で付与されます。
<img src="/images/img/SCT_6430.JPG" class="thumbnail">