jquery - Using Hotkeys to navigate tabs -
how can navigate between different tabs using shortcut keys implemented using hotkey following : https://github.com/jeresig/jquery.hotkeys .
<div class="box-content"> <ul class="nav nav-tabs" id="mytab"> <li class="active"><a href="#info">info</a></li> <li><a href="#custom">custom</a></li> <li><a href="#messages">messages</a></li> </ul> <div id="mytabcontent" class="tab-content"> <div class="tab-pane active" id="info"> <h3>charisma <small>a full featured template</small> </h3> <p>its full featured, responsive template admin panel. optimized tablets , mobile phones.</p> <p>check how looks on different devices:</p> <a href="http://www.responsinator.com/?url=usman.it%2fthemes%2fcharisma" target="_blank"><strong>preview on iphone size.</strong></a> <br> <a href="http://www.responsinator.com/?url=usman.it%2fthemes%2fcharisma" target="_blank"><strong>preview on ipad size.</strong></a> </div> <div class="tab-pane" id="custom"> <h3>custom <small>small text</small> </h3> <p>sample paragraph.</p> <p>your custom text.</p> </div> <div class="tab-pane" id="messages"> <h3>messages <small>small text</small> </h3> <p>sample paragraph.</p> <p>your custom text.</p> </div> </div> </div>
and hotkeys script implementation below :
<script src="<?php echo base_url(); ?>assets/hotkeys/jquery-1.4.2.js"></script> <script src="<?php echo base_url(); ?>assets/hotkeys/jquery.hotkeys.js"></script> <script> var y = jquery.noconflict(); y(document).ready(function () { y(document).bind('keydown', 'shift+w', function () { y('#messages')[0].tabs(); }) }); </script>
how can implement when press shift , w (shift+w) , opens messages tab ? using tabs failed.
function activatab(tab){ $('.nav-tabs a[href="#' + tab + '"]').tab('show'); }; y(document).ready(function () { y(document).bind('keydown', 'shift+w', function () { activatab('messages'); }) });
could please try this, haven't tried yet, code looks well!
Comments
Post a Comment