Estou tentando criar um mecanismo de alerta simples, ism com o jQuery Tools - em resposta a um pouco de código Javascript, crie uma sobreposição com uma mensagem e um botão OK que, quando clicado, faz com que a sobreposição desapareça. Trivial, ou deveria ser. Eu tenho seguido servilmentehttp://flowplayer.org/tools/demos/overlay/trigger.html, e tem algo que funciona bem na primeira vez em que é chamado, mas somente nessa hora. Se eu repetir a ação JS que deve expor a sobreposição, isso não ocorre.

Meu conteúdo / DIV:

<div class='modal' id='the_alert'>
  <div id='modal_content' class='modal_content'>
    <h2>hi there</h2>
    this is the body
    <p>
    <button class='close'>OK</button>
    </p>
  </div>
  <div id='modal_background' class='modal_background'><img src='/images/overlay/f9f9f9-180.png' class='stretch' alt='' /></div>
</div>

e o Javascript:

function showOverlayDialog() {
$('#the_alert').overlay({
    mask: {color: '#cccccc', loadSpeed: 200, opacity: 0.9}, 
    closeOnClick: false,
    load: true 
});
}

Como eu disse: Quando showOverlayDialog () é chamado pela primeira vez, a sobreposição aparece exatamente como deveria e desaparece quando o botão "OK" é clicado. Mas se eu fizer com que showOverlayDialog () seja executado novamente, sem recarregar a página, nada acontece. Se eu recarregar a página, o padrão será repetido - a primeira chamada traz a sobreposição, mas a segunda não.

Obviamente, estou perdendo alguma coisa - algum conselho por aí? Obrigado!