Почему появляются сразу все элементы?

Question

[efimenko_b]

Имеется код

$('.hideme').each(function(i) {
  		if( $(window).scrollTop() + $(window).height() > $(this).position().top + $(this).outerHeight() ){
  			$(this).fadeIn(3000);
  		}
    })
	$(window).scroll( function(){
		$('.hideme').each( function(i){
			if( $(window).scrollTop() + $(window).height() > $(this).position().top + $(this).outerHeight() ){
        $(this).fadeIn(3000);
      }
		});
	});

Но при загрузке страницы появляются сразу все элементы, даже те что не попадают под условие и должны появляться только при прокрутке...почему так?
https://jsfiddle.net/cb1g7qq8/
Заранее спасибо.

Answer 1

[Сергей delphinpro]

.position() возвращает отступ от ближайшего не-статик родителя.
А вам, вероятно, нужно относительно документа - .offset()

Comments

[efimenko_b]

никакого эффекта.

[Сергей delphinpro]

efimenko_b: jsfiddle.net/cb1g7qq8/2

Answer 2

[restyler]

position() и offset() будут возвращать нули всегда для элемента скрытого через display:none.
работающий вариант:
https://jsfiddle.net/cb1g7qq8/1/

(анимация visibility делается несложно, в гугле есть)