我正在構建單頁設計網站,並想知道如何在滾動瀏覽ID時嚮導航菜單項添加課程。將ID addClass滾動到導航菜單以更改類別
我猜它會是這樣的:
if at ID-X addClass .active to menuitem-y
在我的導航菜單我有價格的鏈接(鏈接www.example.com/#prices)。所以當我點擊價格時,它會平滑滾動到ID #prices。
所以可能應該是這樣的:
if "#prices" addClass(.active)->Menuitem-y
我猜?
**更新** 感謝DaniP我有一些代碼在#prices到達時觸發警報。
var target = $("#prices").offset().top;
var interval = setInterval(function() {
if ($(window).scrollTop() >= target) {
alert("made it!");
clearInterval(interval);
}
}, 250);
我可以把CSS而不是警報?像#menuitem-y{color:#000;}
這個工程,但只有一個實例,什麼是最好的方式將此應用到更多的菜單項?
var target = $("#prices").offset().top;
var interval = setInterval(function() {
if ($(window).scrollTop() >= target) {
$("#menu-item-16 a").addClass("active-prices");
clearInterval(interval);
}
}, 250);
你試過Bootstrap scrollspy了嗎? http://getbootstrap.com/javascript/#scrollspy –
我沒有使用Bootstrap。我正在使用http://materializecss.com。它有一個滾動功能。 http://materializecss.com/scrollspy.html這可能會工作相同。我有一個去 – Steggie
你嘗試過什麼嗎?至少搜索並嘗試與您的代碼http://stackoverflow.com/questions/7182342/how-to-detect-when-the-user-has-scrolled-to-a-certain-area-on-the-page-在你的頭銜中使用-jqu – DaniP