Search code examples
javascriptjquerygoogle-chromescrollable

Uncaught TypeError:Object[object object] has no method 'on'

I m going to try this: http://jquerytools.org/demos/scrollable/index.html
But without any event trigger, I m getting below error

enter image description here

But I have confusion about, why the on method not finding in even page load 

<head>
<link href="css/scrollable-horizontal.css" rel="stylesheet" type="text/css" />
<link href="css/scrollable-buttons.css" rel="stylesheet" type="text/css" />
<script src="js/jquery-1.6.1.min.js"></script>
<script src="js/jquery.tools.min.js"></script>
</head>

Nothing done at javascript part 

<script>
$(function() {
  // initialize scrollable
  $(".scrollable").scrollable();
});
</script>

It stopped my further implementation. Have any idea about this?

Solution

  • JQuery .on method was added in 1.7. You need to update your JQuery as from your screenshot you are currently using 1.6

    http://api.jquery.com/on/

    Once downloaded from here, change the below where marked

    <head>
<link href="css/scrollable-horizontal.css" rel="stylesheet" type="text/css" />
<link href="css/scrollable-buttons.css" rel="stylesheet" type="text/css" />
<script src="js/jquery-1.6.1.min.js"></script> <!-- Change this line -->
<script src="js/jquery.tools.min.js"></script>
</head>