Designed to make other elements clickable/tapable/pressable using its sibling or child links!
To get started you can either:
- Clone the repo:
git clone https://github.com/lawlesscreation/jquery.clickable.git - Install with npm:
npm install jquery.clickable --save - Install with Bower:
bower install jquery.clickable --save
Then it's just a case of adding required scripts in your page, best at the bottom:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="jquery.clickable.min.js"></script>| Option | Default | Description |
|---|---|---|
| callbackAfter | function() {} | A callback that is triggered after the element has been made clickable |
| clickableChild | null | Used to make a child element clickable of which the script was executed |
| clickableClass | clickable | The class that gets added to elements which have been successfully initialized |
| focusClass | clickable-focus | The class that gets added to the onFocus state of clickable elements |
| hoverClass | clickable-hover | The class that gets added to the onHover state of clickable elements |
| selectLink | null | Used to specify which link to use within the clickable box should more than one link be found |
| urlPrefixes | ['http://', 'https://', 'www.'] | An array of different prefixes that can appear before each link |
$(function(){
$('#clickable-box').find('.box').jqueryClickable();
});$(function(){
$('#clickable-image').find('.box').jqueryClickable({
clickableChild : 'img'
});
});$(function(){
$('#clickable-image-from-heading').find('.box').jqueryClickable({
clickableChild : 'img',
selectLink : 'h4'
});
});You will need node.js before you get started, then:
$ npm install
#=> will install all required node packagesThen simply run either the watcher or build task:
$ grunt
#=> Running "watch" task
#=> Waiting...or
$ grunt build
#=> Done, without errors.Copyright © 2013 @lawlesscreation
Licensed under MIT
- Additional callbacks;
- Finish writing Jasmine test specs.


