プログラムでjQueryツールのオーバーレイを繰り返す

Question

jQueryツール（http://flowplayer.org/tools/overlay/index.html）に関する初心者向けの質問があります。イメージがクリックされたときにオーバーレイがトリガーされ、HTMLボディでこれと比較的よく似たコードが表示されます。

<img id = "shark" src = "http://static.guim.co.uk/sys-images/Education/Pix/picture 
s/2000/11/13/shark.jpg" alt = "click" /> 

<div id = "overlayFrame"> 
    <div id = "overlayContent"></div> 
</div> 

<script type= "text/javascript"> 
    var clickable = document.getElementById('shark'); 
    clickable.onmousedown = ImageClick; 

    function ImageClick(e) 
    { 
     console.log("image clicked"); 
     $("#overlayFrame").overlay 
     ({ 
      mask: 'darkgrey', 
      oneInstance: false, 

      onBeforeLoad: function() 
      { 
       var wrap = this.getOverlay().find("#overlayContent"); 
       wrap.load("overlay.htm"); 
      }, 

      load: true 
     }); 
    } 
</script> 

画像をクリックするたびにオーバーレイが表示されます。今、画像がクリックされるたびに '画像をクリックしました'というメッセージがコンソールに出力されますが、オーバーレイは初めて発生します。オーバーレイが毎回発生するようにこのコードを変更するにはどうすればよいですか？

ありがとうございました！

Answer 1

私はあなたの特定のコードをテストしていませんが、オーバーレイ（）。load（）を毎回呼び出してプログラム的に負荷を繰り返すことができるという同じ問題を解決しました。私はこれがあなたのために働くと思う。以下の最後の行を参照してください：

<script type= "text/javascript"> 
var clickable = document.getElementById('shark'); 
clickable.onmousedown = ImageClick; 

function ImageClick(e) 
{ 
    console.log("image clicked"); 
    $("#overlayFrame").overlay 
    ({ 
     mask: 'darkgrey', 
     oneInstance: false, 

     onBeforeLoad: function() 
     { 
      var wrap = this.getOverlay().find("#overlayContent"); 
      wrap.load("overlay.htm"); 
     }, 

     load: true 
    }).load(); // This is the only code I added 
} 
</script>