javascript - チェーニング jQuery Deferred

Question

jquery deferred でタイマー機能を同期する際に問題が発生しました。タイムアウト後にツールチップを表示し、別のタイムアウト後にそれを削除する関数を作成しました。2回呼び出すと機能しますが、3回目の呼び出しは2回目の呼び出しの直後に実行されます。何が私を間違えたのですか？

3回呼び出される関数は次のとおりです。

function tutorial($element, qtipConfig, startTimeout, stopTimeout) {

    var dfd = $.Deferred();

    window.setTimeout(function() {

        // tooltip
        var qtip = $element.qtip(qtipConfig);
        // api
        var qtipApi = $element.qtip('api');
        // show tooltip
        qtipApi.show();

        window.setTimeout(function() {
            qtipApi.hide();
            dfd.resolve();
        }, stopTimeout);

    }, startTimeout);

    return dfd.promise();
};

この関数の呼び出し方法は次のとおりです。

    tutorial($('.mybutton'), qtipConfig, 1000, 2000)
    .then(
        function() {
            return tutorial($('.button2'), qtipConfig, 1000, 2000);
        })
    .then(
        function() {
            return tutorial($('.button3'), qtipConfig, 1000, 2000);
    });

ありがとうございました。