Link To

A simple util to make any element linkable using a data attribute.

Useful for cases where the element can't be wrapped with an anchor tag.

Basic Usage

This util will self instantiate and automatically be set up for elements with a data-link-to attribute on them.

<div data-link-to="/foo"></div>

require([ "lib/components/link_to" ], function(LinkTo) {
  // No need to do anything.
});

Note: This util tries to be "clever" about not hijacking expected click behaviour. Should there be an element where a JS event needs to take precedence that is not in the list below, a js-prevent-link-to class can be used.

Blacklisted elements: a , button , input , label , option , select

Providing a context

For situations where content is loaded via AJAX (for example), the LinkTo constructor receives a context argument so you can specify the new context for this.

<div class="js-lightbox">
  <div data-link-to="/foo"></div>
</div>

new LinkTo(".js-lightbox");