jquery waypoints 获取元素名称
jquery waypoints get name of element
我正在尝试使用 jquery waypoints 当元素在屏幕上滚动时,我需要获取可见元素的名称属性以突出显示菜单。但我似乎无法让它做任何事情。当项目在视口内时,我的代码当前会提醒 "x",但其他 jquery 不起作用..
$('.anchor-point').waypoint(
function(){
$('.side-bar li').removeClass('active');
//$(this).addClass('testing'); ### this does nothing ###
//var name = $(this).attr('name');
//alert(name); ### this alerts as undefined ###
alert('x'); ### this alerts "x" ###
}
);
<div class="scroller">
<a name="item-01" class="heading anchor-point"></a>
<p> Nunc ultrices eget sem ut blandit. Etiam tempor ultricies pellentesque. Ut orci quam, rutrum ac metus eu, rhoncus condimentum enim. Nulla ex quam, vehicula vel mauris eu, tincidunt vestibulum magna. Curabitur hendrerit elit in justo interdum facilisis. Vivamus fringilla cursus justo, vitae porttitor tellus vulputate euismod. Proin laoreet faucibus finibus. In sit amet commodo ex. Sed ut sollicitudin velit, quis ultricies justo. Pellentesque sollicitudin dignissim malesuada. Duis egestas hendrerit tellus, eget lacinia elit rutrum at. Aliquam ullamcorper laoreet nisl. Integer est dui, hendrerit non massa rhoncus, vulputate ultricies dolor. Nullam vel enim quis mauris condimentum tincidunt nec sed odio. Aliquam ultricies consectetur lorem. </p>
</div>
<div class="scroller">
<a name="item-02" class="heading anchor-point"></a>
<p> Nunc ultrices eget sem ut blandit. Etiam tempor ultricies pellentesque. Ut orci quam, rutrum ac metus eu, rhoncus condimentum enim. Nulla ex quam, vehicula vel mauris eu, tincidunt vestibulum magna. Curabitur hendrerit elit in justo interdum facilisis. Vivamus fringilla cursus justo, vitae porttitor tellus vulputate euismod. Proin laoreet faucibus finibus. In sit amet commodo ex. Sed ut sollicitudin velit, quis ultricies justo. Pellentesque sollicitudin dignissim malesuada. Duis egestas hendrerit tellus, eget lacinia elit rutrum at. Aliquam ullamcorper laoreet nisl. Integer est dui, hendrerit non massa rhoncus, vulputate ultricies dolor. Nullam vel enim quis mauris condimentum tincidunt nec sed odio. Aliquam ultricies consectetur lorem. </p>
</div>
<div class="scroller">
<a name="item-03" class="heading anchor-point"></a>
<p> Nunc ultrices eget sem ut blandit. Etiam tempor ultricies pellentesque. Ut orci quam, rutrum ac metus eu, rhoncus condimentum enim. Nulla ex quam, vehicula vel mauris eu, tincidunt vestibulum magna. Curabitur hendrerit elit in justo interdum facilisis. Vivamus fringilla cursus justo, vitae porttitor tellus vulputate euismod. Proin laoreet faucibus finibus. In sit amet commodo ex. Sed ut sollicitudin velit, quis ultricies justo. Pellentesque sollicitudin dignissim malesuada. Duis egestas hendrerit tellus, eget lacinia elit rutrum at. Aliquam ullamcorper laoreet nisl. Integer est dui, hendrerit non massa rhoncus, vulputate ultricies dolor. Nullam vel enim quis mauris condimentum tincidunt nec sed odio. Aliquam ultricies consectetur lorem. </p>
</div>
$('.anchor-point').waypoint(
var loc = this;
function(){
$('.side-bar li').removeClass('active');
$(loc).addClass('testing');
alert('x');
}
);
试试这个..我认为 $(this) 无法获得 dom 元素。
我正在尝试使用 jquery waypoints 当元素在屏幕上滚动时,我需要获取可见元素的名称属性以突出显示菜单。但我似乎无法让它做任何事情。当项目在视口内时,我的代码当前会提醒 "x",但其他 jquery 不起作用..
$('.anchor-point').waypoint(
function(){
$('.side-bar li').removeClass('active');
//$(this).addClass('testing'); ### this does nothing ###
//var name = $(this).attr('name');
//alert(name); ### this alerts as undefined ###
alert('x'); ### this alerts "x" ###
}
);
<div class="scroller">
<a name="item-01" class="heading anchor-point"></a>
<p> Nunc ultrices eget sem ut blandit. Etiam tempor ultricies pellentesque. Ut orci quam, rutrum ac metus eu, rhoncus condimentum enim. Nulla ex quam, vehicula vel mauris eu, tincidunt vestibulum magna. Curabitur hendrerit elit in justo interdum facilisis. Vivamus fringilla cursus justo, vitae porttitor tellus vulputate euismod. Proin laoreet faucibus finibus. In sit amet commodo ex. Sed ut sollicitudin velit, quis ultricies justo. Pellentesque sollicitudin dignissim malesuada. Duis egestas hendrerit tellus, eget lacinia elit rutrum at. Aliquam ullamcorper laoreet nisl. Integer est dui, hendrerit non massa rhoncus, vulputate ultricies dolor. Nullam vel enim quis mauris condimentum tincidunt nec sed odio. Aliquam ultricies consectetur lorem. </p>
</div>
<div class="scroller">
<a name="item-02" class="heading anchor-point"></a>
<p> Nunc ultrices eget sem ut blandit. Etiam tempor ultricies pellentesque. Ut orci quam, rutrum ac metus eu, rhoncus condimentum enim. Nulla ex quam, vehicula vel mauris eu, tincidunt vestibulum magna. Curabitur hendrerit elit in justo interdum facilisis. Vivamus fringilla cursus justo, vitae porttitor tellus vulputate euismod. Proin laoreet faucibus finibus. In sit amet commodo ex. Sed ut sollicitudin velit, quis ultricies justo. Pellentesque sollicitudin dignissim malesuada. Duis egestas hendrerit tellus, eget lacinia elit rutrum at. Aliquam ullamcorper laoreet nisl. Integer est dui, hendrerit non massa rhoncus, vulputate ultricies dolor. Nullam vel enim quis mauris condimentum tincidunt nec sed odio. Aliquam ultricies consectetur lorem. </p>
</div>
<div class="scroller">
<a name="item-03" class="heading anchor-point"></a>
<p> Nunc ultrices eget sem ut blandit. Etiam tempor ultricies pellentesque. Ut orci quam, rutrum ac metus eu, rhoncus condimentum enim. Nulla ex quam, vehicula vel mauris eu, tincidunt vestibulum magna. Curabitur hendrerit elit in justo interdum facilisis. Vivamus fringilla cursus justo, vitae porttitor tellus vulputate euismod. Proin laoreet faucibus finibus. In sit amet commodo ex. Sed ut sollicitudin velit, quis ultricies justo. Pellentesque sollicitudin dignissim malesuada. Duis egestas hendrerit tellus, eget lacinia elit rutrum at. Aliquam ullamcorper laoreet nisl. Integer est dui, hendrerit non massa rhoncus, vulputate ultricies dolor. Nullam vel enim quis mauris condimentum tincidunt nec sed odio. Aliquam ultricies consectetur lorem. </p>
</div>
$('.anchor-point').waypoint(
var loc = this;
function(){
$('.side-bar li').removeClass('active');
$(loc).addClass('testing');
alert('x');
}
);
试试这个..我认为 $(this) 无法获得 dom 元素。