[解決済み] jQueryは5秒後に要素を自動で隠します。

質問

jQueryを使用して、フォームが読み込まれた5秒後にWebページ内の要素を自動的に隠すことは可能ですか?

基本的に、私は

<div id="successMessage">Project saved successfully!</div>

で、5秒後に消えるようにしたい。jQuery UIやhideの効果を調べてみましたが、なかなか思い通りにいかず困っています。

<script type="text/javascript">
        $(function() {
            function runEffect() {

                var selectedEffect = 'blind';

                var options = {};

                $("#successMessage").hide(selectedEffect, options, 500);
            };

            $("#successMessage").click(function() {
                runEffect();
                return false;
            });
        });
    </script>

クリック関数を削除して、5秒後にrunEffect()を呼び出すタイムアウトメソッドを追加して欲しいです。

どのように解決するのですか？

$(function() {
    // setTimeout() function will be fired after page is loaded
    // it will wait for 5 sec. and then will fire
    // $("#successMessage").hide() function
    setTimeout(function() {
        $("#successMessage").hide('blind', {}, 500)
    }, 5000);
});

注意 : setTimeoutの中でjQuery関数を動作させるためには、jQuery関数を以下のようにラップする必要があります。

function() { ... }