jQuery সংযোজন ফেইডইন

Question 1

তবে সেখানকার সমাধানগুলি আমার পক্ষে কার্যকর হচ্ছে না। আমি চেষ্টা করছি:

 $('#thumbnails').append('<li><img src="/photos/t/'+data.filename+'"/></li>').hide().fadeIn(2000);

তবে পুরো তালিকাটি একবারে ম্লান হয়ে যায়, প্রতিটি আইটেম যুক্ত করা হয় নি is দেখে মনে হচ্ছে hide()এবং fadeIn()এটি প্রয়োগ করা হচ্ছে $('#thumbnails')না <li>। পরিবর্তে আমি কীভাবে তাদের এটি প্রয়োগ করতে পারি? এটিও কাজ করে না:

$('#thumbnails').append('<li stle="display:none"><img src="/photos/t/'+data.filename+'"/></li>').filter(':last').fadeIn(2000);

অন্যান্য পরামর্শ?

Question 2

আপনার প্রথম প্রয়াস খুব নিকটে, তবে মনে রাখবেন যে append()এটি ফিরে আসছে #thumbnails, আপনি যে আইটেমটি এতে যুক্ত করেছেন তা নয়। পরিবর্তে, প্রথমে আপনার আইটেমটি তৈরি করুন এবং hide().fadeIn()এটি যুক্ত করার আগে প্রয়োগ করুন :

$('#thumbnails')
    .append($('<li><img src="/photos/t/'+data.filename+'"/></li>')
        .hide()
        .fadeIn(2000)
    );

এটি <li>সময়ের আগে নির্মাণে ডলারের ফাংশনটি ব্যবহার করে । আপনি এটি দুটি লাইনে লিখতেও পারেন, অবশ্যই যদি এটি আরও পরিষ্কার করে তোলে:

var item = $('<li><img src="/photos/t/'+data.filename+'"/></li>')
    .hide()
    .fadeIn(2000);
$('#thumbnails').append(item);

সম্পাদনা করুন: আপনার দ্বিতীয় প্রচেষ্টাটিও প্রায় সেখানে রয়েছে, তবে এর children()পরিবর্তে আপনার প্রয়োজন filter()। পরেরটি কেবল বর্তমান ক্যোয়ারী থেকে নোডগুলি সরিয়ে দেয়; আপনার সদ্য যুক্ত হওয়া আইটেমটি সেই ক্যোয়ারিতে নেই, তবে পরিবর্তে এটি একটি শিশু নোড।

$('#thumbnails')
    .append('<li stle="display:none"><img src="/photos/t/'+data.filename+'"/></li>')
    .children(':last')
    .hide()
    .fadeIn(2000);

Question 3

$('<li><img src="/photos/t/'+data.filename+'"/></li>')
    .appendTo('#thumbnails')
    .hide().fadeIn(2000);

Question 4

বেন ব্ল্যাঙ্কের উত্তর ভাল তবে আমার কাছে বিবর্ণ, চটকদার। আপনি সংযোজন পরে ফেইড চেষ্টা করুন:

var item = $('<li><img src="/photos/t/'+data.filename+'"/></li>').hide();
$('#thumbnails').append(item);
item.fadeIn(2000);

Question 5

চেষ্টা করে দেখুন!

 $('#thumbnails').append(<li> your content </li>);
 $('#thumbnails li:last').hide().fadeIn(2000);

Question 6

এটা চেষ্টা কর:

$('<li><img src="/photos/t/'+data.filename+'"/></li>').hide().appendTo('#thumbnails').fadeIn(2000);

Question 7

আমি যে সমাধানটি দিয়েছিলাম তা এখানে:

function onComplete(event, queueID, fileObj, response, info) {
    var data = eval('(' + response + ')');
    if (data.success) {
        $('#file-' + queueID).fadeOut(1000);
        var img = new Image();
        $(img).load(function () { // wait for thumbnail to finish loading before fading in
            var item = $('<li id="thumb-' + data.photo_id + '"><a href="#" onclick="deletePhoto(' + data.photo_id + ')" class="delete" alt="Delete"></a><a href="#" class="edit" alt="Edit"></a><div class="thumb-corners"></div><img class="thumbnail" src="/photos/t/' + data.filename + '" width=150 height=150/></li>');
            $('#thumbnails').append(item.hide().fadeIn(2000));).attr('src', '/photos/t/' + data.filename);
        } else {
            $('#file-' + queueID).addClass('error');
            //alert('error ' + data.errno); // TODO: delete me
            $('#file-' + queueID + ' .progress').html('error ' + data.errno);
        }
    }
}

এটি আপলোডের সাথে কাজ করে । এটি loadচিত্রটির প্রদর্শিত হওয়ার আগেই লোডিং শেষ হওয়ার জন্য অপেক্ষা করতে jquery এর ইভেন্ট ব্যবহার করে। এটি সেরা পদ্ধতির কিনা তা নিশ্চিত নই, তবে এটি আমার পক্ষে কাজ করেছে।