Geek asks and answers

JQuery.toggle () modal show / hide dialog

I looked through some similar questions, but I searched for eternity and was not lucky to find an implementation that is just like what I'm looking for.

It is very simple:

<a class="contacttoggle" href="#">Contact</a>
<div>Lots of content between</div>
<div>Lots of content between</div>
<div>Lots of content between</div>
<div>Lots of content between</div>
<div class="contact_box">Contact info that is initially hidden and then fades in when the "contact_toggle" Contact link above is clicked</div>

I am looking for this to disappear and it will be absolutely positioned on the page (don't worry, I can handle CSS). I just DO NOT want the slide effect. Just fade away.

It seems to me that this code should work, but it is not: (

$(document).ready(function(){


    /* function to show and hide main navigation conatct box */
    $(".contact_box").hide();

    $('a.contacttoggle').click(function() { 
        $(this).next("div").find(".contact_box").toggle(400);
        return false;
    }); 


})
+3
source share
4 answers

How about fadeToggle ?

+5
source

Instead toggle(), just animate()opacity with a "switch" .

$(".contact_box").animate({opacity:'toggle'}, 400);
+2
source

blockUI? , .

Follow this link for more information: http://jquery.malsup.com/block/

+2
source

Instead

$(this).next("div").find(".contact_box").toggle(400);

Try

$("div.contact_box").toggle(400);
0
source

More articles:


All Articles