0

現在、ホームページのテキストは、スライド アウトを開始するクリック機能を介してのみ表示されます。

私がやりたいのは、これを変更して、クリックして表示する必要がないようにすることです。ページの読み込みから約 3 秒後にテキストを表示 (フェードイン) したいと考えています。

これは私が現在持っているものです:-

$('.introbox span').replaceWith(function(){

return '\
    <div class="slideOutTip '+$(this).attr('class')+'" style="'+$(this).attr('style')+'">\
        \
        <div class="tipVisible">\
            <div class="tipIcon"><div class="plusIcon"></div></div>\
            <span class="tipTitle">'+$(this).attr('title')+'</span>\
        </div>\
        \
        <div class="slideOutContent">\
            <p>'+$(this).html()+'</p>\
        </div>\
    </div>';
});

「plusIcon」をクリックすると、テキストがスライドして表示されます。

クリック機能のリッスンアウトは...

$('.tipVisible').bind('click',function(){
    var tip = $(this).parent();

したがって、100% ではありませんが、おそらく setDelay と FadeIn を使用して autoload を使用するために必要なものを変換する必要があると思います。

クリックを使用せずに遅延後に自動表示するように変更する方法を教えてください。前もって感謝します。

私がやろうとしていることをより簡単に確認できる場合は、 jsfiddleにコードを追加しようとしました - ありがとう。

4

1 に答える 1

0

非常に簡単です: で行うことで関数を作成し.tipVisible.click、次に設定しますwindow.setTimeout(yourFunction, 3000);

@コメント：あなたのJSはすでにかなり複雑です。おそらくすべてを再編成して再コーディングするので、実装方法のヒントを与えることができます（フィドルに追加したときにすぐには機能しませんでしたが、私はそこに問題を見つけるのが少し面倒です）。

    var animate = function(obj) {
        var tip = obj ? $(obj).parent() : $(".tipVisible").parent();

        /* If a open/close animation is in progress, exit the function */
        if (tip.is(':animated')) return false;

        if (tip.find('.slideOutContent').css('display') == 'none') {
            tip.trigger('slideOut');
        }
        else tip.trigger('slideIn');
    }

    window.setTimeout( animate, 3000);

    $('.tipVisible').bind('click', function() {
        animate(this);
    });

編集: まあ、これは少なくとも何かを行っています。今、いつ、どのように何をする必要があるかを理解する必要があります;)

PS: jQuery を使用しましたが、Mootools フレームワークをロードしました... Mootools は $(document).ready() を知りません

于 2012-06-26T09:38:39.723 に答える