2014-01-07 3 views
0

Когда я динамически добавляю div в другой родительский div (как в http://jsfiddle.net/RP3Zy/1/), все родительские div переизлучаются, что делает его мерцающим. Как я могу избежать этого?jQuery div мерцает при добавлении в документ с помощью slideDown

<html> 
<head></head> 
<body> 
    <button id="add">Add</button> 
    <button id="hide">Hide all</button> 
    <div class="container"></div> 
    <script type="text/javascript"> 
     $("#add").click(function() { 
     var divs = $(".dyn"); 
     console.log(divs.length); 
     var adiv = $(".container").append('<div id="div" class="dyn">I\'m no more hidden!</div>').not(divs).hide().slideDown(); 
    }); 

    $("#hide").click(function() { 
     $(".container").slideUp(); 
    }); 
    </script> 
</body> 
</html> 
+1

Ну, когда вы добавляете, вы также '.hide() slideDown();' который я считаю, делая мигание, которое вы описываете. – ElliotM

ответ

0

Похоже, вы пытаетесь slideDown против всего родительского элемента, когда вы действительно хотите только slideDown на тот, который вы добавляете. Нечто подобное может, кажется, работает:

$("#add").click(function() { 
    elem = $('<div id="div" class="dyn">I\'m no more hidden!</div>').hide(); 

    $(".container").append(elem); 

    elem.slideDown(); 
}); 

$("#hide").click(function() { 
    $(".container").slideUp(); 
}); 

Отъезд пример здесь:. http://jsfiddle.net/RP3Zy/2/

Смежные вопросы