JavaScript — как отобразить элемент после загрузки страницы с эффектом?

Question

[goodknight]

Здравствуйте. Пытаюсь добавить какой-нибудь эффект, например fadeTo(); к элементу, который отображается, когда страница загрузилась.

Использую такой код просто для отображения элемента после window.onload

function showPopup(){
		document.getElementById('popup').style.display = 'block';
	}

	window.onload = showPopup();

Как сюда прикрутить, например, fadeTo();, не могу понять. Надо передать в функцию параметр fadeTo и потом определить его в функции? Как ?

Answer 1

[Crash]

Код JQuery

$(function(){
  $( "#popup" ).fadeTo( "slow" , 0.5, function() {
    // Animation complete.
  });
});

Comments

[goodknight]

@Bandicoot Спасибо, но мне надо, чтобы fadeTo использовалось именно после события window.onload.

[Crash]

@goodknight можешь разместить свой код перед вызовом fadeTo

[iDevArtem]

Это подразумевает что DOM-дерево построено (страница загружена)
$(function(){ ... });
или:
jQuery.ready(function(){ ... });

Результат:

jQuery.ready(function(){
    $( "#popup" ).fadeIn();
});

[Facetrollex]

@ArtemDoink onload и ready разные события
советую прочесть stackoverflow.com/questions/3698200/js-window-onlo...

Answer 2

[Facetrollex]

если не используйте jQuery, то почитайте здесь stackoverflow.com/questions/13733912/javascript-fa...

Answer 3

[personaljs]

задать к примеру ему visibility: hidden и кучу анимации на css3. И после загрузки документа добавить класс к элементу(к примеру _loaded,а у элемента к примеру .elem).
задать в css ._loaded .elem {
visiblity: visible;
}
А самой анимацией балуетесь в css и не надо никаких js

Comments

[iDevArtem]

> И после загрузки документа добавить класс к элементу
а это по вашему не js делает?!

[personaljs]

Это делает js но не нуждается в подключениях библиотек различных. Я это хотел сказать.