Table Link
The easiest way to add links in your table rows, cells or elements that are not anchors!
Yeah man... Html can't do that for you out of the box. And it's sad. Very sad.
Don't worry bro here is the solution:
Instalation
With npm:
npm install --save table-link
With bower:
bower install --save table-link
Or you can just download a ZIP.
Setup
Browserify
var TableLink = ;
Browser (Global)
Some CSS (Optional)
[data-href] {cursor: pointer;}table [data-href]:hover,table [data-href]:hover > * {background-color: #AAB7D1; // Put whatever color you want... Or none.}
Usage
In your table:
Some random crazy data.
In your Javascript file:
TableLink;// Soooooo simple...
You can make use of blank
and self
(default) for targeting the link:
Some random crazy data.
Some random crazy data.
Using in other elements
TableLink.init()
parameter like this:
Put the selector to find those as the first TableLink;
Before and After events
The 'before' event can cancel the link opening by returning false.
The "element" argument is the delegate target, which can be td
, tr
, th
or any element that matches the selector, if it was passed.
The "target" argument is the real event target. The sencond can be used to see if the clicked element is the delegated element or some other element inside the delegated element.
TableLink;
TableLink;
TableLink;
License
This repository is under the MIT License