2017-04-03 5 views
0

私はFoundationの公開モーダルを使用しようとしています。タイミングの出現モーダルの公開

私はすでに基本的なモーダルの使用だけで成功しています。 私がプロジェクト(symfony2とfoundationを使用している)を始めたばかりなので、 私はいくつかの困難を抱えています。基礎の仕組みが本当に分かりません。

だから私は何をする必要があるか:

は、その周りにグレーの背景なしでアウトアニメーションフェードで、数秒(今の10)の後に開いたモーダルを明らかにしてください。ちなみに、フェードイン機能はモーダルの最初の出現後にのみ発生しますが、なぜそうは理解できませんか?

これを行う方法を検索しようとしましたが、これに関するトピックが見つかりませんでした(多分私は検索では悪いかもしれません)。

ありがとうございました! :D

PS:私の母国語ではなく、文法上の誤りで申し訳ありません。

任意の精度については、尋ねてください!ここ は、私が使用しているモーダルのコピーではありません:

<p><a href="#" data-reveal-id="myModal">Click Me For A Modal</a></p> 
<div id="myModal" data-overlay="false" class="reveal-modal" 
    data-animate="fade-in fade-out" data-reveal aria-labelledby="modalTitle" 
    aria-hidden="true" role="dialog"> 
    <h2 id="modalTitle">Awesome. I have it.</h2> 
    <p class="lead">Your couch. It is mine.</p> 
    <p>I'm a cool paragraph that lives inside of an even cooler modal. Wins!</p> 
    <a class="close-reveal-modal" aria-label="Close">&#215;</a> 
</div> 

答えて

0

まず、財団のコールバック(hat tip to this Foundation forum post and codepen code)を使用して、ページのロードにモーダルを発射:

$(document).ready(function(){ 
setTimeout(
    function() 
    { 
    //do something special 
$('#myModal').foundation('reveal', 'open') 
    }, 10000); 
}); 

次にあなたが表示する必要がある:なし次のような背景オーバーレイを明らかにしてください:

.reveal-modal-bg { display: none; } 
+0

ありがとうございました。私はその場所に置いておきたい遅延(10秒)について考えていますか? – AHAV

+0

私はsetTimeout関数を追加したので、ページのロード後に10秒の遅延があり、モーダルが発生します。 –

+0

CSSとJSの読み込み順序によっては、document.readyが必要ではないかもしれません。 –

関連する問題