jquery .hide() fadeIn()

To jest mój kod:jquery .hide() fadeIn()

$('.items').html(response).hide().fadeIn();

Problem polega na tym, że kiedy ten jest ładowany do strony "przeskakuje" w górę z powodu, że .hide() .. jest tam jakiś inny sposób to zrobić?

Źródło

2012-01-26 Mackelito

Dlaczego masz Hide() dwa razy? Gdy zostanie ukryty, powinien pozostać ukryty, dopóki nie pokażesz() go ponownie. – danwellman

Och ... moje złe .. tylko literówka ... zmieni pytanie! – Mackelito

Czy elementy ".items" są widoczne po załadowaniu strony (a następnie, prawdopodobnie, zaktualizowane przez wywołanie ajax)? Czy pomysł ukrywania i zanikania zwraca uwagę na właśnie zaktualizowany bit? – nnnnnn

Można użyciu krycie zamiast jeśli chcesz zachować wymiary elementu nienaruszonego:

$('.items').html(response).css({'opacity':0}).animate({'opacity':1});

Źródło

2012-01-26 11:35:17

Czysto i prosto .. dlaczego nie pomyślałem o tym? ;) Dzięki! – Mackelito

Bez problemu koleś :) –

Dowiedziałem się, że to też działa ... jest szybsze niż drugie? $ (odpowiedź) .hide(). AppendTo (ajaxElement) .fadeIn(); – Mackelito

Ukryj za pomocą CSS, a następnie znikną ją w razie potrzeby:

css:

.items { 
    display:none; 
}

JavaScript

$('.items').html(response).fadeIn();

Źródło

2012-01-26 11:33:23 ManseUK

Problem polega na tym, że jest to odpowiedź ajax .. są tam elementy pokazujące na stronie ładowanie, że właśnie filtruję – Mackelito

masz kilka innych opcji - zamień HTML i podświetl div, aby pokazać jego zmienione ... dodaj div i przesuń poprzedni div, a następnie przesuń nowy div up .... lub fadeOut()/fadeIn()? – ManseUK

Jeśli chcesz pokazać sprawne SLAJDU między istniejącej zawartości i nowe, spróbuj wykonać następujące czynności:

$(function(){ 
    $('.items').fadeOut(function(){ 
     $(this).html(response).fadeIn(); 
    }) 
});

Źródło

2012-01-26 11:39:00

To jest czystsze rozwiązanie, ponieważ unika się migający efekt element dodany jest pierwszy, a następnie szybko konieczności jego krycie ustawiony na 0.

ten sposób elem jest dodana już mającą krycie 0.

var elem = $(response).css({'opacity': 0}); 
$('.items').html(elem); 
elem.animate({'opacity': 1});

Źródło

2013-02-02 19:51:59

Odpowiedz

Powiązane problemy