2.0.0 • Published 8 months ago

@vaadin-component-factory/vcf-anchor-nav v2.0.0

Weekly downloads
229
License
https://raw.githu...
Repository
github
Last release
8 months ago

<vcf-anchor-nav>

Gitter npm version Published on Vaadin Directory

Web Component for easily creating layouts with sticky anchor navigation tabs and content sections.

  • Automates the linking of tabs and sections.
  • Smooth scrolls to section on tab click and sets the URL hash.
  • Scrolls to URL hash on load (preserve selected tab on refresh).

GIF for Vaadin Component Factory anchor nav

Live demo ↗ | API documentation ↗

Installation

Install vcf-anchor-nav:

npm i @vaadin-component-factory/vcf-anchor-nav --save

Usage

Once installed, import it in your application:

import '@vaadin-component-factory/vcf-anchor-nav';

Add <vcf-anchor-nav> element and <vcf-anchor-nav-section>s to the page.

<vcf-anchor-nav>
  <h1 slot="header">Header</h1>
  <vcf-anchor-nav-section name="One"> ... </vcf-anchor-nav-section>
  <vcf-anchor-nav-section name="Two"> ... </vcf-anchor-nav-section>
  <vcf-anchor-nav-section name="Three"> ... </vcf-anchor-nav-section>
</vcf-anchor-nav>

Running demo

  1. Fork the vcf-anchor-nav repository and clone it locally.

  2. Make sure you have npm installed.

  3. When in the vcf-anchor-nav directory, run npm install to install dependencies.

  4. Run npm start to open the demo.

Server-side API

This is the client-side (Polymer 3) web component. If you are looking for the server-side (Java) API for the Vaadin Platform, it can be found here: Anchor Nav

License

Apache License 2.0

2.0.0

8 months ago

3.0.1

8 months ago

3.0.0

8 months ago

23.4.0

2 years ago

23.2.1

3 years ago

23.2.0

3 years ago

23.3.0

3 years ago

23.1.0

3 years ago

23.0.1

3 years ago

23.0.0

3 years ago

1.3.0

4 years ago

1.2.13

4 years ago

1.2.12

4 years ago

1.3.0-beta3

4 years ago

1.2.11

4 years ago

1.2.10

4 years ago

1.2.0

4 years ago

1.2.8

4 years ago

1.2.7

4 years ago

1.2.6

4 years ago

1.2.5

4 years ago

1.2.4

4 years ago

1.2.3

4 years ago

1.2.2

4 years ago

1.2.1

4 years ago

1.2.0-beta.3

4 years ago

1.2.9

4 years ago

1.2.0-beta.2

4 years ago

1.2.0-beta.1

4 years ago

1.2.0-beta.0

4 years ago

1.1.9

4 years ago

1.1.8

4 years ago

1.1.10

4 years ago

1.1.7

4 years ago

1.1.6

4 years ago

1.1.5

4 years ago

1.1.4

4 years ago

1.1.3

5 years ago

1.1.2

5 years ago

1.1.1

5 years ago

1.1.0

5 years ago

1.0.16

5 years ago

1.0.15

5 years ago

1.0.14

5 years ago

1.0.13

5 years ago

1.0.10

5 years ago

1.0.9

5 years ago

1.0.8

5 years ago

1.0.7

5 years ago

1.0.6

5 years ago

1.0.5

5 years ago

1.0.4

5 years ago

1.0.3

5 years ago

1.0.2

5 years ago

1.0.1

5 years ago

1.0.0

5 years ago

0.2.6

5 years ago

0.2.3

5 years ago

0.2.5

5 years ago

0.2.4

5 years ago

0.2.2

5 years ago

0.2.1

5 years ago

0.2.0

5 years ago

0.1.8

5 years ago

0.1.9

5 years ago

0.1.7

5 years ago

0.1.6

5 years ago

0.1.5

5 years ago

0.1.2

5 years ago

0.1.4

5 years ago

0.1.3

5 years ago

0.1.1

5 years ago