A Custom Element to augment select elements.
Ruby JavaScript HTML Makefile
Latest commit 3f46069 Aug 24, 2016 @lucasmazza lucasmazza 💅
Permalink
Failed to load latest commit information.
docs
src
test
.gitignore
Gemfile
Gemfile.lock
LICENSE
Makefile
README.md
_config.yml
bower.json
package.json

README.md

navigation-select-element

WIP y'all

navigation-select-element is a Custom Element to augment select elements to perform redirects when changed, meant to be used as a replacement for navigation menus on small viewports.

Installation

You can install it through Bower or NPM:

bower install navigation-select-element --save
npm install navigation-select-element --save

You will need to include a Custom Elements polyfill for browsers that does not support Custom Elements yet.

bower install --save webcomponentsjs

Usage

You can extend existing select elements using the is attribute to turn them into navigation-select ones.

<select is='navigation-select'>
  <option value>Select an option to navigate</option>
  <option value='/page-1'>Page 1</option>
  <option value='/page-2'>Page 2</option>
  <option value='https://github.com'>GitHub.com</option>
  <option value='/'>Go back to /</option>
</select>

Turbolinks Support

For applications using Turbolinks, [Turbolinks.visit][turbolinks-visit] will be used instead of a traditional window.location = for navigating the user to its desired location.

TODO

  • Support the Custom Elements v1 spec.
  • Attach a navigation-select element to an existing element and copy anchors from it.
  • Add support for customizing the Turbolinks action parameter.

License

Copyright © 2016-ω Plataformatec. See LICENSE file.