Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [jQuery] Jak wykonać pasek ładowania reagujący na poruszanie bocznmym paskiem (scroll)
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
Sajrox
Witam,

Czy komuś udało się wykonać w jQuery pasek ładowania reagującego na zdarzenie związane z przesunięciem strony w górę i w dół. Mowa o pasku scroll (ie znam dokładnej jego nazwy) smile.gif

Chodzi o to że mimo tego gdy przesunę stronę na sam dół element DIV (wspomniany pasek ładowania) będzie zawsze widoczny przy górnej krawędzi.

Jak już pisałem podobnie jest na poczcie gmail. Podczas łądowania elementu, widzimy po środku przy górnej krawędzi pasek z napisem "Ładowanie..."
ayeo
To nie ma nic wspólnego z jQuery. Po prostu dajesz ten pasek w body jako absolute z top: 0;

Pozdrawiam!
Sajrox
Oj chyba nie zrozumiałem. Ta metoda którą podałeś faktycznie umieszcza element na samej górze ale w momencie gdy przesunę stronę w dół scrollbarem (paskiem bocznym). DIV zostaje na samej gorze. A mi chodzi o to aby poruszał się razem z tym scrollbarem.

Ale dzięki za chęci smile.gif
ayeo
Faktycznie chyba uprościłem smile.gif W jQuery masz event taki:
Kod
$(document).ready(function()
{
    $(window).scroll(function(e)
    {
        $("#pasek").css("top", $(window).scrollTop() + "px");
    });
});


Pozdrawiam!


// zedytowałem
Sajrox
Właśnie coś jest nie tak.
Teoretycznie kod poniżej powinien działać a jednak nie działa:

  1. $(document).ready(function()
  2. {
  3. $(document).scroll(
  4. function (e) {
  5. print_r(e);
  6. }
  7. );
  8. });


W zamian dostaje:

  1. [originalEvent] => [object Event]
  2. [type] => scroll
  3. [timeStamp] => 1235566061393
  4. [jQuery1235566059769] => true
  5. [which] => undefined
  6. [wheelDelta] => undefined
  7. [view] => undefined
  8. [toElement] => undefined
  9. [target] => [object HTMLDocument]
  10. [srcElement] => undefined
  11. [shiftKey] => undefined
  12. [screenY] => undefined
  13. [screenX] => undefined
  14. [relatedTarget] => undefined
  15. [relatedNode] => undefined
  16. [prevValue] => undefined
  17. [pageY] => undefined
  18. [pageX] => undefined
  19. [originalTarget] => [object HTMLDocument]
  20. [newValue] => undefined
  21. [metaKey] => undefined
  22. [keyCode] => undefined
  23. ...


Niestety wszędzie są same "undefined" sad.gif
ayeo
Patrz do góry, zedytowałem posta winksmiley.jpg
Sajrox
O kurczaki kopane. Działa exclamation.gif smile.gif

Dzięki wielkie smile.gif
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.