conflict between bootstrap and JQuery responsive slider

Question

I have a problem with a slider in the layout.
I have a slider and it is working but the image is compressed and distorted, instead of moving, as in the original slider.

I get the following error:

TypeError: $(window).on is not a function
$(window).on( 'smartresize.eislideshow', function( event ) {

How can I solve it. I am not familiar with this js.

• My site
• Original slider

Answer 1

You're using jQuery 1.6.4 in the page which doesn't support the on() method. This was only introduced in version 1.7 http://api.jquery.com/on/

Edit

As well as the lines you have included there are two scripts loading older versions. These are the referencing lines. They must be getting pulled in from your wordpress template.

<script type='text/javascript' src='http://b.pusku.com/wp-includes/js/jquery/jquery.js?ver=1.7.2'></script>

<script type='text/javascript' src='http://b.pusku.com/wp-content/themes/wpbootstrap/bootstrap/js/jquery.js?ver=3.4.2'></script>

Answer 2

You have not one, not two, but 3 different versions of jQuery included in the head of your site!!! (1.8.0, 1.7.2, and lastly, 1.6.4). The last one overwrites the previous 2 and, 1.6.4 does not include the .on() method.