Book Image

Learning jQuery : Better Interaction Design and Web Development with Simple JavaScript Techniques

Book Image

Learning jQuery : Better Interaction Design and Web Development with Simple JavaScript Techniques

Overview of this book

Table of Contents (18 chapters)
Learning jQuery
Credits
About the Authors
About the Reviewers
Preface

Tooltips


Although the row highlighting might be a useful feature, so far it’s not apparent to the user that the feature even exists. We can begin to remedy this situation by giving all author cells a clickable class, which will change the cursor to a pointer when a user hovers the mouse cursor over them:

$(document).ready(function() {
  $('table.striped td:nth-child(' + column + ')' )
  .addClass('clickable')
  .click(function() {
    var thisClicked = $(this).text();
    $('table.striped td:nth-child(' + column + ')' )
    .each(function(index) {
      if (thisClicked == $(this).text()) {
        $(this).parent().toggleClass('highlight');
      } else {
        $(this).parent().removeClass('highlight');
      };
    });
  })
})

The clickable class is a step in the right direction, for sure, but it still doesn’t tell the user what will happen when the cell is clicked. As far as anyone knows (without looking at the code, of course) that clicking could send the user to another page. Some further...