0

私は現在、数秒後にコンテンツを表示する 1 つの Javascript に取り組んでいます。

これが私のスクリプトです：

<script type="text/javascript">
$(function () {
var count = 5,
    countdown = setInterval(function () {
        $("p.countdown").html(count);
        if (count == 0) {
            $("p.countdown").html("MY TEXT POPUP");
            clearInterval(countdown);
        }
        count--;
    }, 1000);
});
</script>
<p class="countdown"></p>

今のところ、数秒後にテキストを表示する方法はわかっていますが、この要素が非表示の場合に DIV 要素を表示する方法を知りたいですか?

CSS秒が= 0の場合にのみ表示したい要素のコードは次のとおりです。

#countblock{
    display:none;
    width:200px;
    height:50px;
    position:absolute;
    background-color:#F1f1f1;
}

したがって、このブロックをテキストの代わりに表示し、秒が = 0 になる前に表示できないようにする方法を教えてください。

私の他の質問は、テキストで div ブロック要素を作成する方法"X"と、これをクリックし"X"てブロックを非表示にする方法です。

質問をうまく説明できたと思います。

前もって感謝します！

4

3 に答える 3

0

これを試して

クラスまたはIDを使用して要素を表示および非表示にする場合

元

$('#ID').show() // by id show
$('.countdown').hide() //by class hide
于 2013-11-14T12:08:43.733 に答える
0

JQuery の機能をhide()使用できます。show()

if (count == 0) {
    $("p.countdown").html("MY TEXT POPUP");
    $("p.countdown").show();
    clearInterval(countdown);
}

またはcss()関数:

$("#countblock").css('display', 'block');

2 番目の質問では、次の関数を使用できますclick()。

<p id="clickToHide"> X </p>

<script>
    $('#clickToHide').click(function() {
        $('.countdown').hide();
    });
</script>
于 2013-11-14T12:08:59.783 に答える
0

CSS で使用display: noneしたので、次を使用する必要があります。

if (count == 0) {
            $("#countblock").css('display','block');
            clearInterval(countdown);
        }
于 2013-11-14T12:12:24.853 に答える