jQuery .toggle () Модальное диалоговое окно показа / скрытия

Question

Я просмотрел несколько похожих вопросов - но я искал вечно, и мне не повезло найти реализацию, которая будет такой же, как и я.

Это ОЧЕНЬ просто:

<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>

Я ищу, чтобы это исчезло, и оно будет абсолютно позиционировано на странице (не беспокойтесь, я справлюсь с CSS). Я просто НЕ хочу эффект слайда. Просто исчезнуть.

Мне кажется, что этот код должен работать, но это не так: (

$(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;
    }); 


})

Answer 1

А как насчет fadeToggle ?

Answer 2

Как насчет blockUI? Это один из тех плагинов, которыми я действительно злоупотребляю.

Перейдите по этой ссылке для получения дополнительной информации: http://jquery.malsup.com/block/

Answer 3

Вместо toggle(), просто animate() непрозрачность с 'переключателем' .

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

Answer 4

Вместо

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

Попробуйте

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