• -> lax.js
• ->

12.47kbit

src="/js/simpleParallax.min.js
var $pala = document.getElementsByClassName('simpara');

//オプションで調整する
new simpleParallax($pala,{
  delay: .8,//慣性がつく
	transition: 'cubic-bezier(0,0,0,1)'
});

//html 比率ボックスを親にする。画像に直接、又は背景画像として設置
.simpara { position: absolute; bottom: 0; left: 0 ;width: 100%; height:100%; line-height: 0;
  background-size:100% auto;　background-position: bottom;
}
img.simpara {height:auto!important;}

//html:画像直
<div class="ar-219">
<div class="arbox">
<img src="/photo/bg/ls-2.jpg" alt="ls-2.jpg" class="simpara">
</div>
</div>

//html:背景画像
<div class="ar-219">
<div class="arbox">
<div class="simpara" style="background-image: url(/photo/bg/ls-1.jpg)"></div>
</div>
</div>

この文章はダミーです。文字の大きさ、量、字間、行間等を確認するために入れています。ダミーテキストです。文字の大きさや形、色をご確認ください。テキストはOSやブラウザによってフォントが変わります。このようにスマホ・パソコンに依存した文字になります。

この文章はダミーです。文字の大きさ、量、字間、行間等を確認するために入れています。ダミーテキストです。文字の大きさや形、色をご確認ください。テキストはOSやブラウザによってフォントが変わります。このようにスマホ・パソコンに依存した文字になります。

この文章はダミーです。文字の大きさ、量、字間、行間等を確認するために入れています。ダミーテキストです。文字の大きさや形、色をご確認ください。テキストはOSやブラウザによってフォントが変わります。このようにスマホ・パソコンに依存した文字になります。

この文章はダミーです。文字の大きさ、量、字間、行間等を確認するために入れています。ダミーテキストです。文字の大きさや形、色をご確認ください。テキストはOSやブラウザによってフォントが変わります。このようにスマホ・パソコンに依存した文字になります。

  
    var $pala2 = document.getElementsByClassName('simpara2');
    new simpleParallax($pala2,{
       orientation: 'up right'
    });
  
  

    
      overflow: true,
    
    

この文章はダミーです。文字の大きさ、量、字間、行間等を確認するために入れています。ダミーテキストです。文字の大きさや形、色をご確認ください。テキストはOSやブラウザによってフォントが変わります。このようにスマホ・パソコンに依存した文字になります。

この文章はダミーです。文字の大きさ、量、字間、行間等を確認するために入れています。ダミーテキストです。文字の大きさや形、色をご確認ください。テキストはOSやブラウザによってフォントが変わります。このようにスマホ・パソコンに依存した文字になります。

この文章はダミーです。文字の大きさ、量、字間、行間等を確認するために入れています。ダミーテキストです。文字の大きさや形、色をご確認ください。テキストはOSやブラウザによってフォントが変わります。このようにスマホ・パソコンに依存した文字になります。

この文章はダミーです。文字の大きさ、量、字間、行間等を確認するために入れています。ダミーテキストです。文字の大きさや形、色をご確認ください。テキストはOSやブラウザによってフォントが変わります。このようにスマホ・パソコンに依存した文字になります。