Jak znaleźć najbliższy element do aktualnej pozycji z jQuery

Mam dokument z kilku sekcji takiego:Jak znaleźć najbliższy element do aktualnej pozycji z jQuery

<div class='section' id='sec1'> 
    lalala 
    lalala 
    lalala 
</div> 

<div class='section' id='sec2'> 
    lalala 
    lalala 
    lalala 
</div> 

<div class='section' id='sec3'> 
    lalala 
    lalala 
    lalala 
</div> 

<div class='section' id='sec4'> 
    lalala 
    lalala 
    lalala 
</div>

Jak mogę złapać najbliższy <div.section> do bieżącej pozycji przewijania (przypuszczalnie będzie to zrównać do sekcji, którą aktualnie czyta czytelnik)?

Źródło

2012-05-25 Scribblemacher

Poza tym przy użyciu najechania kursorem można przyjąć pozycję przewijania i odjąć wysokość każdego „.section” od niego aż wynosi 0 lub mniej. Będzie to coraz trudniejsze, im więcej będziesz owijał te divy. – bygrace

Wokół tych elementów div jest spora kwota, a dużo w niej (to wyjście HTML z docbook) – Scribblemacher

Gizmovation daje lepsze podejście poniżej i tak – bygrace

Można użyć $(window).scrollTop() i $(el).postion().top aby dowiedzieć się, jak daleko element jest z górnej części ekranu po przewinięciu.

Możesz następnie użyć tych informacji do manipulowania elementem zgodnie z potrzebami.

Oto pracuje jsfiddle przykład: http://jsfiddle.net/gizmovation/x8FDU/

Źródło

2012-05-25 20:01:31 christurnerio

Witajcie, Zastanawiam się, czy można to osiągnąć również przy pomocy zwykłego kodu JavaScript? – AppRoyale

-5

Za każdym razem, gdy umieścisz kursor na elemencie, wydarzenie mousemove powie Ci, który element przesuwasz.

$(document).bind('mousemove', function(e) { 
    e.target 
    /* 
     the target in click/hover events 
     is the element that the event was 
     triggered on. 
    */ 
});

Jedną wadą może być fakt e.target daje element o najwyższym z-index - jeden w górnym najbardziej warstwy - więc jeśli masz nakładkę powyższy tekst to daje nakładkę nie tekst div.

Źródło

2012-05-25 19:55:11

Proszę dodać więcej wyjaśnień na temat odpowiedzi i wyjaśnić, dlaczego to działa. – Johannes

@johannes - wyjaśnienie w komentarzu jest całkiem jasne, IMO. Za każdym razem, gdy umieścisz kursor na elemencie, zdarzenie 'mousemove' powie Ci, na którym elemencie się znajdujesz. –

Jak znaleźć najbliższy element do aktualnej pozycji z jQuery

Odpowiedz

Powiązane problemy