このコードは再調整できますか？

Question

私は落葉花びらの効果のためにこのコードを持っています。元のコードは私のものではありません。イメージのようないくつかのものを変更する方法を超えたコーディングについては何も分かりませんが（このバージョンのコードで行ったように）、落ちそうに見えるかどうかは疑問ですページの左側にのみ表示されます。

私はこの種のことにはまったく無知ですが、私は答えを探してみましたが、私は確信していません。howどのように質問するのですか？私の最高の希望は誰かが、探して答えられるようになりました。私はそれを少し試してみましたが、転倒のスピードを変える方法を考え出す以外に、私はちょうどそれをやり遂げることができるかどうかわかりません。私はちょっと恐れることがありますが、それは完全に書き直される必要があるでしょうが、今のところ、どんな助けも認められるでしょう。 （元のコードは依然として信用されており、元のチュートリアルのブログに戻ってリンクしています。この質問には関係ないので削除しましたが、何らかの理由で必要に応じて提供することができます）。

<script>if(typeof jQuery=='undefined'){document.write('<'+'script');document.write(' language="javascript"');document.write(' type="text/javascript"');document.write(' src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">');document.write('</'+'script'+'>')}</script><script>if(!image_urls){var image_urls=Array()}if(!flash_urls){var flash_urls=Array()}image_urls['rain1']="https://2.bp.blogspot.com/-LVX2LSAy4zM/VuyuSSQGKoI/AAAAAAAAAHk/0xFc8xRWzh8rUrbWaxkLaXFiSM6D46fiA/s1600/imageedit_2_9597694661.png";image_urls['rain2']="https://2.bp.blogspot.com/-LVX2LSAy4zM/VuyuSSQGKoI/AAAAAAAAAHk/0xFc8xRWzh8rUrbWaxkLaXFiSM6D46fiA/s1600/imageedit_2_9597694661.png";image_urls['rain3']="https://2.bp.blogspot.com/-LVX2LSAy4zM/VuyuSSQGKoI/AAAAAAAAAHk/0xFc8xRWzh8rUrbWaxkLaXFiSM6D46fiA/s1600/imageedit_2_9597694661.png";image_urls['rain4']="https://2.bp.blogspot.com/-LVX2LSAy4zM/VuyuSSQGKoI/AAAAAAAAAHk/0xFc8xRWzh8rUrbWaxkLaXFiSM6D46fiA/s1600/imageedit_2_9597694661.png";$(document).ready(function(){var c=$(window).width();var d=$(window).height();var e=function(a,b){return Math.round(a+(Math.random()*(b-a)))};var f=function(a){setTimeout(function(){a.css({left:e(0,c)+'px',top:'-30px',display:'block',opacity:'0.'+e(10,100)}).animate({top:(d-10)+'px'},e(7500,8000),function(){$(this).fadeOut('slow',function(){f(a)})})},e(1,8000))};$('<div></div>').attr('id','rainDiv') 
.css({position:'fixed',width:(c-20)+'px',height:'1px',left:'0px',top:'-5px',display:'block'}).appendTo('body');for(var i=1;i<=20;i++){var g=$('<img/>').attr('src',image_urls['rain'+e(1,4)]) 
.css({position:'absolute',left:e(0,c)+'px',top:'-30px',display:'block',opacity:'0.'+e(10,100),'margin-left':0}).addClass('rainDrop').appendTo('#rainDiv');f(g);g=null};var h=0;var j=0;$(window).resize(function(){c=$(window).width();d=$(window).height()})});</script> 

Answer 1

まず第一に、あなたは、コードの作成者に確認してください。彼はあなたにあなたの問題に対する解決策を与えるかもしれません。

---

setTimeout()コール内部left: e(0, c/2) + 'px'に変更left: e(0,c) + 'px'。
eはrandom(startRange, endRange)関数であり、cはウィンドウの長さなので、ウィンドウの左から雨滴が現れる可能性のある位置を半分にすることで、スクリーンの左半分に効果的に制限できます。

ここにはfiddle illustrating the changeがあります。

私はスクリプト全体を理解するために困っていませんし、あなたがチェックする必要がある場合がありますcに他の二つの参照があることに注意してください（古いブラウザの互換性のために多分に？）：

• サイズのrainDivはc - 20 pxです。これは、最近のブラウザでは問題ではないかもしれません。
• forループは、スクリプトの開始時に雨滴を生成するように見えますが、何も変わっていないことがわかりました。また、ランダムe(0, c)を使用します。

Answer 2

ビューティとあなたのコードのこの http://jsbeautifier.org/

例を試してみてください：彼は人々が変更と彼のコードを再利用してもよいかどうかが

<script> 
if (typeof jQuery == 'undefined') { 
    document.write('<' + 'script'); 
    document.write(' language="javascript"'); 
    document.write(' type="text/javascript"'); 
    document.write(' src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">'); 
    document.write('</' + 'script' + '>') 
} 
</script> 

<script> 
if (!image_urls) { 
    var image_urls = Array() 
} 
if (!flash_urls) { 
    var flash_urls = Array() 
} 
image_urls['rain1'] = "https://2.bp.blogspot.com/-LVX2LSAy4zM/VuyuSSQGKoI/AAAAAAAAAHk/0xFc8xRWzh8rUrbWaxkLaXFiSM6D46fiA/s1600/imageedit_2_9597694661.png"; 
image_urls['rain2'] = "https://2.bp.blogspot.com/-LVX2LSAy4zM/VuyuSSQGKoI/AAAAAAAAAHk/0xFc8xRWzh8rUrbWaxkLaXFiSM6D46fiA/s1600/imageedit_2_9597694661.png"; 
image_urls['rain3'] = "https://2.bp.blogspot.com/-LVX2LSAy4zM/VuyuSSQGKoI/AAAAAAAAAHk/0xFc8xRWzh8rUrbWaxkLaXFiSM6D46fiA/s1600/imageedit_2_9597694661.png"; 
image_urls['rain4'] = "https://2.bp.blogspot.com/-LVX2LSAy4zM/VuyuSSQGKoI/AAAAAAAAAHk/0xFc8xRWzh8rUrbWaxkLaXFiSM6D46fiA/s1600/imageedit_2_9597694661.png"; 
$(document).ready(function() { 
    var c = $(window).width(); 
    var d = $(window).height(); 
    var e = function(a, b) { 
     return Math.round(a + (Math.random() * (b - a))) 
    }; 
    var f = function(a) { 
     setTimeout(function() { 
      a.css({ 
       left: e(0, c) + 'px', 
       top: '-30px', 
       display: 'block', 
       opacity: '0.' + e(10, 100) 
      }).animate({ 
       top: (d - 10) + 'px' 
      }, e(7500, 8000), function() { 
       $(this).fadeOut('slow', function() { 
        f(a) 
       }) 
      }) 
     }, e(1, 8000)) 
    }; 
    $('<div></div>').attr('id', 'rainDiv') 
     .css({ 
      position: 'fixed', 
      width: (c - 20) + 'px', 
      height: '1px', 
      left: '0px', 
      top: '-5px', 
      display: 'block' 
     }).appendTo('body'); 
    for (var i = 1; i <= 20; i++) { 
     var g = $('<img/>').attr('src', image_urls['rain' + e(1, 4)]) 
      .css({ 
       position: 'absolute', 
       left: e(0, c) + 'px', 
       top: '-30px', 
       display: 'block', 
       opacity: '0.' + e(10, 100), 
       'margin-left': 0 
      }).addClass('rainDrop').appendTo('#rainDiv'); 
     f(g); 
     g = null 
    }; 
    var h = 0; 
    var j = 0; 
    $(window).resize(function() { 
     c = $(window).width(); 
     d = $(window).height() 
    }) 
}); 
</script>