如何改變內部鏈接的風格，如果目前有

Question

我想創建一個導航菜單，我期望是一個非常長的頁面。我使用內部鏈接來簡化從某個部分或另一個部分獲取的內容，但該頁面是專門爲用戶在一個會話中上下滾動頁面而設計的。我發現內部鏈接不足以定位用戶在頁面上的位置，因此我在點擊內部鏈接時添加了平滑滾動。這對一些人有幫助，但如果你目前在旁邊的話，我很想改變內部鏈接的風格。

作爲一個例子，我們在下面有五個鏈接。用戶從與鏈接A相對應的部分開始，因此它是大膽的。當他們進一步向下滾動時，他們到達與鏈接B相對應的部分，所以它現在是大膽的。如果他們跳下到與鏈路E對應的部分，如果他們跳到鏈接C.

〜

步驟1變得黑體，並且相同的.......... ..... 步驟2 ............... 步驟3 ............... 步驟4

鏈接A ...............鏈接A ...............鏈接A ........... ....鏈接A

鏈接B ............... 鏈接B ...............鏈接B .......... .....鏈接B

鏈接C ...............鏈接C ...............鏈接C ... ............ 鏈接C

鏈接D ...............鏈接D ........... ....鏈接D ...............鏈接D

鏈接E ...............鏈接E .... ........... 鏈接E ...............鏈接E

〜

有什麼辦法可以做到這一點？

Answer 1

你也許可以用「懸停」事件，假設用戶的指針會在哪裏是你的內容鏈接蒙山A中的DIV，B，C，...

，但它不會在所有情況下工作...您還可以計算用戶向下滾動了多少，然後確定他在頁面中的位置。

這不是一件容易的事情。

Answer 2

使用javascript來跟蹤每個部分的滾動頂部位置，並且如果用戶輸入部分使用JavaScript來查找與其相關聯的鏈接，並添加一個類到您想要的樣式，同時從類中刪除類上一個鏈接。

Answer 3

一種方法是使用javascript查找所有內部鏈接，然後獲取offsetTop這將返回從頁面頂部到元素的像素數。然後我不確定是否有可靠的方法來判斷頁面是否被滾動。如果不是，則每隔幾秒輪詢一次以查看它的位置，然後與偏移量頂部進行比較。然而，這可能會有更好的解決方案。