1

ユーザーがボタン/divをクリックしたときにdivをフェードインさせようとしています。次に、2回目のクリックで、divを再びフェードアウトさせ、このスクリプトを繰り返し/繰り返しにしたい。

divをフェードインするために使用しているものは次のとおりです。

<script>

    $('.submit_review').click(function () {
        if ($('.submit_review').is(":visible")) {
             $('.review_submit_box').delay(400).fadeIn(300);




        }
    });
</script>

ボタンのクリックでフェードインおよびフェードアウトするために私がやろうとしたことは次のとおりですが、正しい方向にプッシュする必要があります。

<script>

    $('.submit_review').click(function () {
        if ($('.submit_review').is(":visible")) {
             $('.review_submit_box').delay(400).fadeIn(300);

        } else if ( $('.submit_review').click(function () {
         $('.review_submit_box').is(":visible")) {
            $('.review_submit_box').fadeOut(300);



        }
    });
</script>

html:

<div class="reviews_section">
<div class="submit_review"><div class="
submit_review_text">Submit a Review</div></div>
<div class="review_submit_box"></div>
</div>
<div class="reviews_section2">
<?php include('includes/mod_profile/mod_reviews/mod_reviews.php'); ?>

</div>
4

5 に答える 5

3

Why not simply use jQuery's fadeToggle http://api.jquery.com/fadeToggle/

You could toggle the fade in/out on click and that would reduce your code to a couple of lines

EDIT: Here's some code

$('.submit_review').click(function() {
  $('.review_submit_box').fadeToggle(300)
})
于 2013-04-29T12:07:41.137 に答える
0

これを試してくださいhttp://jsfiddle.net/gabrieleromanato/cX88R/

var test = $('#test'),
    $in = $('#in'),
    out = $('#out'),
    toggle = $('#toggle'),
    to = $('#to');


$in.click(function() {
    test.fadeIn(1000, function() {
        alert('Complete');
    });
});


out.click(function() {
    test.fadeOut(1000, function() {
        alert('Complete');
    });
});


toggle.click(function() {
    test.fadeToggle(1000, function() {
        alert('Complete');
    });
});

to.click(function() {
    test.fadeTo(1000, 0.5, function() {
        alert('Complete');
    });
});
于 2013-04-29T12:11:04.977 に答える