Jak przewinąć element wewnątrz elementu nadrzędnego, gdy przechodzi stały element?

Question

To jest trochę zbyt trudne dla mojej wiedzy jQuery/javascript, więc przykro mi to mówić, że tak naprawdę nie próbowałem niczego jeszcze. Potrzebuję wskazówek, żeby wskazać właściwy kierunek!

Problem polega na tym, że mam stały element na mojej stronie, a podczas przewijania w dół ten element będzie wchodził w inne opakowania, a gdy w tym opakowaniu potrzebuję mniejszego elementu podrzędnego, aby "przyciągnąć" do mojego stałego elementu i gdy jest on w elemencie.

Rodzaju trudne do wytłumaczenia, zrobiłem statyczny makieta tutaj:

http://jsfiddle.net/ycmYc/

Kiedy „Fixed koszyk przycisk” osiągnie cenę, muszę go dołączyć i użyj przycisku koszyka ile to jest w cenach "produkt-div". Po opuszczeniu i przejściu do następnej, cena powinna pozostać w dolnej części produktu, a następnie ponownie przyciągnąć do przycisku koszyka, gdy użytkownicy osiągną go, przewijając w górę.

Cóż, znowu przepraszam, że nie próbowałem niczego, ale jestem zgubiony. Gdybym musiał to zrobić bez żadnej pomocy, myślę, że pójdę z waypoints.js, ale to jest dalekie od optymalnego.

Każda pomoc DUŻO NAGRODZONA!

Ustalony element zawsze będzie miał tę samą pozycję, więc domyślam się, że można przesunąć z góry przeglądarki zamiast śledzić jego pozycję. Zawsze coś;)

Aktualizacja:

pracuje nad nim siebie, a dostał pracę w dół, ale nie w górę:

powinny wyjaśnić, co mam na myśli:

http://retype.se/temp/scrolltest/test.html

Podczas przewijania pod względem ceny łączy się z przyciskiem w dół i luzuje się przy wyjściu z pojemnika. Teraz mam problem z przewinięciem i przewijam w górę do pierwotnej pozycji podczas przewijania w górę :)

Answer 1

To jest po prostu nieumiejętność, ale może robi się wszystko (sry, nie ma czasu na skrzypce). Ale wpadłem na pomysł, być może próbując optycznie oszukać.

Chodzi mi o to, aby obliczyć bezwzględne pozycje wszystkich działek cenowych, ukryć je, a gdy działka koszyka osiągnie tę pozycję, przewijając, pokazać podział ceny dla x ilości przewijania pikseli (lub poprzez z-indeksy przez tworzenie tła, nie wiesz, co Ci lepiej pasuje).

Mam nadzieję, że to trochę pomogło, może dostanę dziś czas, żeby to napisać.

Answer 2

To zależy od ograniczeń. Możesz wykryć pozycję przewijania okna za pomocą: window.pageYOffset lub document.documentElement.scrollTop.

Jeśli elementy div są tego samego rozmiaru, można łatwo obliczyć, który przycisk jest podany, a cena przy nim jest równa position: fixed.

Answer 3

Chcesz tego?

http://jsfiddle.net/ycmYc/39/

tylko wyniki: http://fiddle.jshell.net/ycmYc/39/show/light/

aktualizacja:

Jak chodzi?

http://jsfiddle.net/ycmYc/93/

tylko wyniki: http://fiddle.jshell.net/ycmYc/93/show/light/