Gostaria de saber como pego o posicionamento de um determinado elemento quando ele chega no centro da "window", pois preciso fazer uma animação quando ele está centralizado. Obrigada a quem responder com jQuery.
2 Respostas
Para saber o centro exato você terá que subtrair a metade da largura/altura do elemento pela largura/altura da página.
Exemplo:
posicao = $('.elemento').offset();
centro_horizontal = ($(window).width() / 2) - ($('.elemento').width()/2);
centro_vertical = ($(window).height() / 2) - ($('.elemento').height()/2);
if (posicao.left == centro_horizontal && posição.top == centro_vertical){
alert('elemento no centro');
}
Você pode utilizar o plugin jquery WayPoint http://imakewebthings.com/jquery-waypoints/
Faça o download do plugin, e referencie em seu HTML.
Então use o parâmetro offset: 50%
, assim é o centro da view.
Após isso basta fazer algo parecido
$('#seu-elemento').waypoint(function() {
alert('Animação acontece quando chegar no meio da página')
}, { offset: '50%' });
Fiz um exemplo em http://jsfiddle.net/r57V5/