1. 程式人生 > >滾動監聽(上面導航下面錨點)

滾動監聽(上面導航下面錨點)

就是點選導航一個欄目,會顯示對應的內容
在這裡插入圖片描述
基本使用方法

在這裡插入圖片描述

**

讓欄目有選中的效果?

**
在這裡插入圖片描述
在這裡插入圖片描述

data-spy=“scroll”
style=“position: relative”

**

當導航欄和內容框的距離達到多少時,導航欄選中效果會發生切換?

**
在這裡插入圖片描述
在這裡插入圖片描述
data-offset=“0”

**

如果一個頁面有多個導航條,不能每一個都有效果,如何指定和哪一個導航條關聯呢?

**
在這裡插入圖片描述
這是給每一個導航條新增唯一的ID標識
在這裡插入圖片描述
然後再內容框裡新增 data-target="#nav" 屬性,讓內容與哪一個導航條發生關聯