建站资源下载详情
为您免费提供多种建站资源下载，包括网站模板下载、前端插件下载和字体下载！您只需注册为会员即可任意下载！
JQuery锚点跳转动画插件anchor.js
简介
anchor.js 是一款简单且有非常实用的 jQuery 插件，为所有本地链接提供一个平滑的动画，然后跳转到页面的任意一个元素。
 |
|---|
使用
1. 引入文件
<script src="https://cdn.jsdelivr.net/npm/anchor-js/anchor.min.js"></script>2. 基本用法
/**
* Example 1
* Add anchors to all h1's on the page
*/
anchors.add('h1');
/**
* Example 2
* Adds anchors to elements that have been assigned the class '.anchored'
*/
anchors.add('.anchored');
/**
* Example 3
* If no selector is provided, it falls back to a default selector of:
* 'h2, h3, h4, h5, h6'
*/
anchors.add();如果希望浏览器正确跳转到ID，则需要在页面加载过程的早期向页面添加锚点。
3. 配置
| Option | Accepted Values | Default Value | Description |
|---|---|---|---|
placement | rightleft | right | right appends the anchor to the end of the element.left places it to the left, in the margin. |
visible | hoveralways | hover | hover displays the anchor when hovering over the element.always will always display the anchor link. |
icon | (any unicode character) | | Replace the default link icon with the character(s) provided. These are a few good options: #, ¶, ❡, and §. |
class | (any string) | (none) | Adds the provided class(es) to the anchor html. |
base | (any string) | (none) | Prepends the base URI to the anchor href. This is useful when adding anchors to pages with changing content. |
truncate | (any positive number) | 64 | Truncates the generated ID to the specified character length. |
ariaLabel | (any text) | Anchor | Allows you to customize or translate the default aria-label ("Anchor"), for screenreaders that encounter the link. |
titleText | (any text) | (none) | Adds the text as title text to all anchors. |
相关链接
官方地址 ：https://www.bryanbraun.com/anchorjs/
github 地址 ：https://github.com/bryanbraun/anchorjs
更多相似前端插件