Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [AJAX][PHP]preloader - dobrze?
kamilo818
post
Post #1





Grupa: Zarejestrowani
Postów: 250
Pomógł: 11
Dołączył: 20.01.2014

Ostrzeżenie: (0%)
-----

Zerknijcie:

[PHP] pobierz, plaintext 
  1. <!DOCTYPE html>
  2. <html lang="pl">
  3. 	<head>
  4. 		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  5.  
  6. 		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
  7. 		<script type="text/javascript" src="http:///js/jquery.cycle.all.js"></script>
  8. 		<script src="http://code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
  9. 		<meta charset="" />
  10. 		<meta name="author" content="" />
  11. 		<title>Preloader</title>
  12. 		<script type="text/javascript">
  13. 			$(document).ready(function() {
  14. 				$.ajax({
  15.  
  16. 					url : ('index.php'),
  17. 					beforeSend : function() {
  18. 						$('.loader').show();		
  19. 					},
  20. 					success : function(obj) {
  21. 						window.setTimeout(function () { 
  22. 							$('.loader').fadeOut();
  23. 								window.setTimeout(function () {
  24. 								$('body').html(obj);}, 500);
  25. 						}, 2000);
  26. 					},
  27. 				});
  28. 			});
  29. 		</script>
  30. 	</head>
  31. 	<body>
  32. 		<div class="loader" style="display: none; margin-top:150px;"><img src="490.GIF"/><br><img src="289.GIF"/></div>
  33. 	</body>
  34. </html>
[PHP] pobierz, plaintext


Zadziała to jak preloader? Czyli bedzie sie pokazywał obrazek zanim sie wczyta cała strona?

Ten post edytował kamilo818 23.07.2014, 20:58:39
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi
trueblue
post
Post #2





Grupa: Zarejestrowani
Postów: 6 806
Pomógł: 1828
Dołączył: 11.03.2014

Ostrzeżenie: (0%)
-----

Najpierw ładujesz obrazek i czekasz na załadowanie: http://stackoverflow.com/a/3537471
Potem wywołujesz ajaxa.

Natomiast, nie powinieneś ładować treści całej strony w ajaxie tylko umieścić ją od razu bezpośrednio w kodzie, bo:
1. Będzie słaba albo wręcz nie będzie indeksacji przez roboty
2. [u]Nie masz zapewnionej w 100% sytuacji[/u], że metoda success ajaxa wywoła się po załadowaniu obrazków zawartych w index.php (a być może tego oczekujesz po ajaxie).

Jeśli chcesz zrobić preloader dla obrazków, powinieneś ustawić warstwę nad całością strony (div fixed background-image lub <img>), sparsować całą stronę pod kątem atrybutu src dla <img> i/lub sparsować css pod względem background-image, oprogramować ich ładowanie, po załadowaniu wszystkich, zniszczyć/schować warstwę z preloaderem.

Ten post edytował trueblue 23.07.2014, 21:25:40
Go to the top of the page
+Quote Post

Posty w temacie
- kamilo818   [AJAX][PHP]preloader - dobrze?   23.07.2014, 20:58:08
- - trueblue   Niekoniecznie, najpierw powinieneś preloadować obr...   23.07.2014, 21:09:23
- - kamilo818   Jeszcze raz tylko wolniej proszę. Sorry ale nie za...   23.07.2014, 21:15:37
- - trueblue   Najpierw ładujesz obrazek i czekasz na załadowanie...   23.07.2014, 21:24:45
- - kamilo818   Coś takiego? [PHP] pobierz, plaintext $(...   23.07.2014, 21:51:48
- - trueblue   [HTML] pobierz, plaintext var images=$('img'...   24.07.2014, 11:25:15

« Następny starszy · Przedszkole · Następny nowszy »
 

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Przełącz na: Standardowy · Przełącz na: Linearny+ · Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 5.10.2025 - 06:57
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn