0

jQueryTools Overlayから移行していますが、RevealbyJavaScriptのクリックイベントを開く方法に関するドキュメントを実際に把握することはできません。

おそらく私はこのコードを持っています：

<a href="#revealModal" class="revealTrigger">Click Me For A Modal</a>
<div id="revealModal" class="reveal-modal">
    <p>Im a cool paragraph that lives inside of an even cooler modal. Wins</p>
</div>

通常、クリックイベントはjQueryToolsオーバーレイで次のようにコーディングします。

$('.revealTrigger').click(function() {
    $('#revealModal').reveal();
});

しかし、これは機能しません。Revealでの同等の正しいコードは何ですか？

そして、コールバックイベントはどうですか？このようなものを書くことはできますか？

$('.revealTrigger').click(function() {
    $('#revealModal').reveal({
        open: function(){
            // prepare some stuff before showing
        },
        opened: function(){
            // execute stuff prepared by open function
        },
    });
});
4

3 に答える 3

4

Revealモーダルは、属性によって2つの方法で開くことができます。

<a href="#" data-reveal-id="myModal">Click Me For A Modal</a>
 <div id="myModal" class="reveal-modal">
      <h2>Awesome. I have it.</h2>
      <p class="lead">Your couch.  It is mine.</p>
      <p>Im a cool paragraph that lives inside of an even cooler modal. Wins</p>
      <a class="close-reveal-modal">&#215;</a>
    </div>

またはjavascriptによって：

<a class="large button" onclick="javascript:showModal();" href="#">Show Modal</a>

<script>
     $('#myModal').foundation('reveal', {
          opened: function () {
              alert('The couch was stolen!');
          },
          closed: function () {
              alert("Now it's yours again");
          }
     });
     $(document).foundation();
     function showModal() {
         $('#myModal').foundation('reveal', 'open');          
     }
</script>
于 2013-03-21T09:55:08.867 に答える
0

open、opened、close、closedイベントをバインドすることもできます。

#CoffeeScript
$("div[class$='-modal']").on "opened", ->
  console.log "howdy"
于 2013-11-19T23:24:16.873 に答える
0

以下のコードを使用してください

   $('#modal_id').bind('closed', function() {
     console.log("myModal closed!");
   });
于 2015-04-08T11:48:42.347 に答える