MenuSpy

一个 JavaScript 库,用于使导航菜单根据当前视图部分突出显示项目。「A JavaScript library to make navigation menus highlight the item based on currently in view section.」

Github星跟蹤圖

MenuSpy

A JavaScript library to make navigation menus highlight the item based on currently in view section.

  • No dependencies
  • Easy to use
  • Lightweight and fast

Usage

Include MenuSpy

<script src="menuspy.js"></script>

MenuSpy will be available in the global scope.

Or install via NPM/Yarn and require as a module

NPM

npm install menuspy

Yarn

yarn add menuspy
var MenuSpy = require('menuspy');

Initialize the plugin on your menu element

<header id="main-header">
  <nav>
    <ul>
      <li><a href="#features">Features</a></li>
      <li><a href="#usage">Usage</a></li>
      <li><a href="#options">Options</a></li>
      <li><a href="#examples">Examples</a></li>
    </ul>
  </nav>
</header>

You can also use data-target on the anchor element with a selector. Example:

<a href="#anything" data-target="selector">Anything</a>
var elm = document.querySelector('#main-header');
var ms = new MenuSpy(elm);

The MenuSpy() constructor accepts two arguments: the container element and an options object.

Options, Option, Type, Default, Description, ---------------------, --------, --------------------------, ------------------------------------------------------------------------, menuItemSelector, String, a[href^="#"], Menu items selector., activeClass, String, active, Class applied on menu item relative to the currently visible section., threshold, Integer, 15, Ammount of space between your menu and the next section to be activated., enableLocationHash, Boolean, true, Enable or disable browser's hash location change., hashTimeout, Integer, 600, Timeout to apply browser's hash location., callback, Function, function(currentItem) {}, A function to be called every time a new menu item activates.

主要指標

概覽
名稱與所有者lcdsantos/menuspy
主編程語言JavaScript
編程語言JavaScript (語言數: 1)
平台
許可證MIT License
所有者活动
創建於2016-09-25 05:18:20
推送於2021-06-07 12:19:23
最后一次提交2021-06-07 09:19:23
發布數7
最新版本名稱1.3.0 (發布於 )
第一版名稱1.0.1 (發布於 )
用户参与
星數305
關注者數9
派生數38
提交數39
已啟用問題?
問題數15
打開的問題數9
拉請求數4
打開的拉請求數0
關閉的拉請求數1
项目设置
已啟用Wiki?
已存檔?
是復刻?
已鎖定?
是鏡像?
是私有?