ブラウザのサイズに変換スケールのサイズを合わせるにはどうすればいいですか？

Question

私はskrollrを使用してスクロールアニメーション効果を作成しています。 私の問題は私のページの下に水平スクロールバーがあります。私の所見はこれが私の翻訳のために起こることです：scale（）。マージンができます。あなたは多分あるため、スケールの私のページがブラウザに収まらない見ることができるようにここで

は私のサンプル出力

です。そして、この1つは

<img src="images/line-2-kanji.png" class="img-responsive" data-1800="opacity: 0; transform: scale(2);" data-1900="opacity: 1; transform: scale(1);" /> 

は、あなたが私を助けることができる規模を持っているイメージがある

<div class="rows"> 
    <div class="col-md-6 left_detail_field" data-1600="opacity: 0; transform:scale(0);" data-2000="opacity: 1; transform: scale(1)"> 
     <h1 class="text-left">SERVICES</h1> 

     <p>We promote qualitative transformations of the system trustee business (hardware, software, and infrastructure), and we provide independent system services in processor peripheral field.</p> 

     <a href="#" class="pull-right link-btn">VIEW DETAILS > </a> 
     <div class="clearfix"></div> 
    </div> 
    <div class="col-md-6 right_kanji_field"> 
     <img src="images/line-2-kanji.png" class="img-responsive" data-1800="opacity: 0; transform: scale(2);" data-1900="opacity: 1; transform: scale(1);" /> <!-- this is the scale that creates the margin gap --> 
    </div> 
</div> 

：

は、ここに私のサンプルコードは？

Answer 1

サイズ変更のjqueryを使用し、ウィンドウのサイズ変更ごとに変換スケールを変更する必要があります。例：

$(window).on('load', function(){ 
    var win = $(this); 
    if (win.width() < 769) { 
     $(element).css('transform','scale(0.2)'); 
    } 
}