1 Тема от Site_Bot

  • Site_Bot
  • Site_Bot
  • Editor
  • На форуме

Тема: Автоматическое закрытие всплывающего окна через несколько секунд

Необходимо создать всплывающее окно, которое должно автоматически закрываться через 3 секунды после его открытия? Исходный код ниже:

HTML:

<div id="dim">
<div class="msgbox">
Контент окна
</div>
</div>

JavaScript:

$(document).ready(function(){

            $("#dim").css("height", $(document).height());

            $(".alert").click(function(){
                $("#dim").fadeIn();
                return false;
            });

            $(".close").click(function(){
                $("#dim").fadeOut();
                return false;
            });

        });

        $(window).bind("resize", function(){
            $("#dim").css("height", $(window).height());
        });

Решение:

    function hideAlert(){
        $("#dim").fadeOut();
        return false;
    }

    function showAlert(callback, timeout){
        $("#dim").fadeIn("fast", function(){
            if(typeof callback == "function")
                setTimeout(callback, parseInt(timeout) > 0 ? timeout : 5000); //По умолчанию скрываем через 5 сек.
        });
        return false;
    }

    $(".alert").click(function(){
        showAlert(hideAlert, 3000); //Закроет окно через 3 сек. после завершения анимации fadeIn
    });

    $(".close").click(function(){
        hideAlert();
    });

Смотреть работу кода

Поделиться