Как закрыть всплывающее окно в jquery

Question

Я создал Popup в JQuery. Если щелкнуть значок почты, откроется всплывающее окно, содержащее

Введите адрес электронной почты - метка Email-текстовое поле Отправить - кнопка кнопка закрытия

Если щелкнуть другой значок, называемый значком печати, откроется другое всплывающее окно с сообщением с подтверждением «Вы уверены, что хотите печатать» с помощью кнопки Да, Нет.

При нажатии значка печати всплывающее окно с почтой должно закрываться автоматически, а также наоборот.

Снимок здесь

http://www.flickr.com/photos/41695354@N08/3864786560/

Мой код здесь.

$("#idemail").live('click', function(event) {
        $(this).addClass("selected").parent().append();
        $(".mailpop").slideFadeToggle()
        $("#idemail").focus();
        return false;
    });

    $(".mailclose").live('click', function() {
        $(".mailpop").slideFadeToggle()
        $("#idemail").removeClass("selected");
        return false;
    });

    $("#idprint").live('click', function(event) {
        $(this).addClass("selected").parent().append();

        $(".printpop").slideFadeToggle()
        $("#idprint").focus();
    return false;
    });

    $(".printclose").live('click', function() {
        $(".printpop").slideFadeToggle()
        $("#idprint").removeClass("selected");
        return false;
    }); 

Пожалуйста, помогите мне

Answer 1

Я никогда не был фанатом 'toggle' в jQuery и только подумал бы об использовании его, чтобы скрыть / показать себя. Даже тогда я просто использую стандартные методы скрытия и показа. Вы также можете закрыть вызовы, чтобы переключиться с помощью точки с запятой ...

Пожалуйста, не ошибитесь ... Я изменил ваши переключаемые вызовы на fadeIn / fadeOut и закрыл вызовы функций точкой с запятой.

$("#idemail").live('click', function(event) {
    $(this).addClass("selected").parent().append();
    $(".mailpop").fadeIn("slow");
    $("#idemail").focus();
    return false;
});

$(".mailclose").live('click', function() {
    $(".mailpop").fadeOut("slow");
    $("#idemail").removeClass("selected");
    return false;
});

$("#idprint").live('click', function(event) {
    $(this).addClass("selected").parent().append();

    $(".printpop").fadeIn("slow");
    $("#idprint").focus();
return false;
});

$(".printclose").live('click', function() {
    $(".printpop").fadeOut("slow");
    $("#idprint").removeClass("selected");
    return false;
});

Answer 2

Является ли slideFadeToggle стандартной функцией jQuery? Если нет, вы можете написать две аналогичные функции - одну для slideFadeOpen и одну для slideFadeClose и использовать их. Или проверьте видимое состояние другого всплывающего окна и переключите его

$("#idprint").live('click', function(event) {
    $(this).addClass("selected").parent().append();

    $(".printpop").slideFadeToggle();

    if ( $(".mailpop").is(":visible")) {
       $(".mailpop").slideFadeToggle();
    }
    $("#idprint").focus();
return false;
});