Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [jQuery] slideSwitch (ładowanie wszystkich zdjęć)
Forum PHP.pl > Forum > Przedszkole
webspy
Witam,

Problem polega tym że przy ładowaniu strony wczytują się wszystkie zdjęcia i długo to zchodzi,

Jak można to poprawić? chyba że to jest złe rozwiązanie i szukać innego? (patrzyłem i wszystkie takie slidery są oparte na liscie img.


  1. <div id="slideshow">
  2. <img class="active" src="image/tlo.jpg" alt="" />
  3. <img src="image/1.jpg" alt="" />
  4. <img src="image/2.jpg" alt="" />
  5. <img src="image/3.jpg" alt="" />
  6. <img src="image/4.jpg" alt="" />
  7. <img src="image/5.jpg" alt="" />
  8. <img src="image/6.jpg" alt="" />
  9. <img src="image/7.jpg" alt="" />
  10. </div>

[JAVASCRIPT] pobierz, plaintext
  1. <script type="text/javascript">
  2.  
  3. function slideSwitch() {
  4. var $active = $('#slideshow IMG.active');
  5.  
  6. if ( $active.length == 0 ) $active = $('#slideshow IMG:last');
  7.  
  8. // use this to pull the images in the order they appear in the markup
  9. var $next = $active.next().length ? $active.next()
  10. : $('#slideshow IMG:first');
  11.  
  12. // uncomment the 3 lines below to pull the images in random order
  13.  
  14. // var $sibs = $active.siblings();
  15. // var rndNum = Math.floor(Math.random() * $sibs.length );
  16. // var $next = $( $sibs[ rndNum ] );
  17.  
  18. $active.addClass('last-active');
  19.  
  20. $next.css({opacity: 0.0})
  21. .addClass('active')
  22. .animate({opacity: 1.0}, 1000, function() {
  23. $active.removeClass('active last-active');
  24. });
  25. }
  26.  
  27. $(function() {
  28. setInterval( "slideSwitch()", 30000 );
  29. });
  30.  
  31. </script>
[JAVASCRIPT] pobierz, plaintext
b4rt3kk
Zmniejsz jakość obrazków, przez co ich rozmiar będzie mniejszy i szybciej się będą wczytywać. Lepiej chyba żeby najpierw wczytało obrazki niż później miało doczytywać i żeby były przeskoki w sliderze?
webspy
Tylko że te zdjęcia mają być jako tło, i jak ktoś ma dużą rozdzielczość to foto będzie do bani.

Wiem że jest taka możliwość, bo gdzieś takie coś widziałem, pierwsze zdjęcie się łąduje normalnie a efekt przejścia do następnego uruchamia się aż następne zdjęcie się załaduje.



Znalazłem rozwiązanie, trochę przerobiłem po swojemu i działa.



Może się komuś przyda.
http://www.jasperrooswinkel.com/smooth-ful...show-in-jquery/
http://www.ajaxblender.com/script-sources/...demo/index.html
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.