Hi I Know this has been asked before but no answer on here seems to help me.
I have this block of JS:
$(document).ready(function() {
$('.play-icon-hover').hover(function() {
$('.cms-model-banner-overlay').addClass('.cms-model-banner-overlay-active');
}, function() {
$('.cms-model-banner-overlay').removeClass('.cms-model-banner-overlay-active');
});
});
And I seem to be getting this error but I have no idea why?
Uncaught TypeError: $(...).ready is not a function
Thanks
You are using Prototype.js
as well as jQuery.js
. If you wanna use jQuery, it is better to encapsulate your code inside an IIFE like this:
(function ($) {
// jQuery code using $
})(jQuery);
So the solution for your issue is either you change $
to jQuery:
jQuery(document).ready(function() {
jQuery('.play-icon-hover').hover(function() {
jQuery('.cms-model-banner-overlay').addClass('.cms-model-banner-overlay-active');
}, function() {
jQuery('.cms-model-banner-overlay').removeClass('.cms-model-banner-overlay-active');
});
});
Or, use a IIFE:
(function ($) {
$(document).ready(function() {
$('.play-icon-hover').hover(function() {
$('.cms-model-banner-overlay').addClass('.cms-model-banner-overlay-active');
}, function() {
$('.cms-model-banner-overlay').removeClass('.cms-model-banner-overlay-active');
});
});
})(jQuery);
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments