Po pierwsze, punkt boczny: ogólnie rzecz biorąc, projektanci stron internetowych poświęcają dużo czasu na próbę poprawienia postrzeganego czasu wczytywania strony, pokazując rzeczy tak szybko, jak to możliwe. Aktywnie idzie to w drugą stronę, przedstawiając pustą stronę, dopóki wszystko nie będzie gotowe, co może nie być idealne.
Ale jeśli jest to właściwe dla danej sytuacji.
Ponieważ wszystko widoczne będzie potomkiem body, można załadować body ukryte i zgaśnie to w Byłoby ważne, aby zawierać awaryjne dla użytkowników bez JavaScript (zwykle mniej niż 2% co najmniej according to Yahoo, ale wciąż). Więc wzdłuż linii:
(Live Copy)
<!DOCTYPE html>
<html>
<head>
<title>Example</title>
<!-- This next would probably be in your main CSS file, but shown
inline here just for purposes of the example
-->
<style type="text/css">
body {
/* Hide it for nifty fade-in effect */
display: none;
}
</style>
<!-- Fallback for non-JavaScript people -->
<noscript>
<style type="text/css">
body {
/* Re-displays it by overriding the above */
display: block;
}
</style>
</noscript>
</head>
<body>
...content...
<script src="jquery.js"></script>
<script>
// This version runs the function *immediately*
(function($) {
$(document.body).fadeIn(1000);
})(jQuery);
</script>
</body>
</html>
Kilka odmian ze strony scenariusza, który, w zależności od kiedy chcesz Ściemniane wystąpić:
Poczekaj na „gotowe” wydarzenie:
Live Copy
// This version waits until jQuery's "ready" event
jQuery(function($) {
$(document.body).fadeIn(1000);
});
Wa to na razie window#load:
Live Copy
// This version waits until the window#load event
(function($) {
$(window).load(function() {
$(document.body).fadeIn(1000);
});
})(jQuery);
window#load pożary bardzo późno w procesie ładowania strony, gdy wszystkie zasoby zewnętrzne (w tym wszystkich obrazów) zostały załadowane. Ale powiedziałeś, że chcesz poczekać, aż wszystko zostanie załadowane, więc może być to, co chcesz zrobić. Z pewnością sprawi, że Twoja strona będzie wolniejsza ...
Czy istnieje taka możliwość w przypadku, gdyby ktoś nie miał włączonej obsługi JavaScript? – optimus203