Понимание основ путевых точек

Question

Я пытаюсь использовать популярную библиотеку jQuery «Путевые точки». Я просмотрел различные примеры и документацию, но я изо всех сил пытаюсь понять, как получить доступ к элементу, прикрепленному к путевой точке.

Чтобы уточнить, у меня есть несколько разделов страницы, принадлежащих классу .nudgedown. Я бы хотел, чтобы они меняли цвет фона после прокрутки. Я пытаюсь увидеть, если что-то работает на всех, предупреждая их первоначальный цвет фона с этим кодом:

$(".nudgedown").waypoint(function(){ 
    alert($(this).css("background-color")); 
}); 

Однако ничего не происходит, и в консоли я получаю эту ошибку:

TypeError: b.ownerDocument is undefined

Что я делать не так? Я что-то пропустил в своем подходе? Заранее спасибо за помощь.

Answer 1

Привет, вы пытаетесь получить неправильный элемент с $(this). Вы можете попробовать это:

$(document).ready(function(){ 
 
\t var waypoints = $('.nudgedown').waypoint({ 
 
       handler: function(direction) { 
 
       var el=$(this).get(0).element; 
 
       console.log($(el).css("background-color")); 
 
      } 
 
\t }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/waypoints/4.0.0/jquery.waypoints.js"></script> 
 
<div style="background-color:blue; height:50px"></div> 
 
<span class="nudgedown" style="background-color:red;">test</span> 
 
<div style="background-color:green; height:800px"></div>

Результат