0
function infoBox(title,text){
    $('.infobox').dialog({
    open: function( event, ui ) {$('.infobox').append('<p style="display:none;>'+text+'</p>'); 
    },
    beforeClose: function( event, ui ) {$('.infobox p').remove(); 
    },
    show:'drop' ,
    position:'top',
    title:title,
});
};

オプションのようなものはありafteropen:ますか?

または、UI効果が終了した後に追加されたテキストをフェードインさせる他の方法はありますか?

たぶん次のようなもの:show:[{show:'drop', function(){$('.infobox p').fadeIn();}],

? 前もって感謝します

4

2 に答える 2

2

私はあなたが探しているものを理解していると思います。.delay()とを使用するだけ.fadeIn()です。

function infoBox(title,text){
        $('.infobox').dialog({
        open: function( event, ui ) {
            var p = $('<p style="display:none;">'+text+'</p>')
            $('.infobox').append(p);
            p.delay(1000).fadeIn(400);
        },
        beforeClose: function( event, ui ) {$('.infobox p').remove(); 
        },
        show:'drop' ,
        position:'top',
        title:title,
    });
}

デモ: http://jsfiddle.net/dirtyd77/yTMwu/69/


編集:次のように書くこともできます:

$('.infobox').append('<p style="display:none;">'+text+'</p>').find('p').delay(1000).fadeIn(400);

デモ: http://jsfiddle.net/dirtyd77/yTMwu/70/

于 2013-02-28T23:25:14.180 に答える
1

これが実際の例です: http://jsfiddle.net/5R49y/3/

HTML:

<div class="infobox" title="dialog"></div>

JavaScript (jQuery / jQuery UI):

function infoBox(title, text) {
    $('.infobox').dialog({
        open: function (event, ui) {
            var p = $('<p/>').append(text).hide().fadeIn(2000)
            $('.infobox').append(p);

 },
        beforeClose: function (event, ui) {
            $('.infobox p').remove();
        },
        show: 'drop',
        position: 'top',
        title: title
    });
}

$(function(){
    infoBox('Title','Lorem ipsum');
});
于 2013-02-28T23:27:59.557 に答える