I'm loading a front-end site onto Wordpress and a javascript file that was working fine before has been edited to avoid any conflicts using $ for jQuery functions. Now I'm getting the error above in the console and can't seem to rectify. I've been having issues with making this effect work on Safari as documented here .
Here's my code in the javascript file -
fadein.js
$.noConflict();
jQuery(document).ready(function($) {
var win = $(window),
doc = $(document),
tags = $("section");
win.on("scroll", function() {
tags.each(function(i, tag) {
if ($(tag).position().top < (doc.scrollTop() + win.outerHeight())) {
$(tag).addClass("visible");
} else {
$(tag).removeClass("visible");
}
});
}
});
});
And the css for the section opacity -
style.css
/* Fade in/out */
section {
opacity: 0;
-webkit-transform: translate(0, 10px);
-webkit-transition: all 1s;
transform: translate(0, 10px);
transition: all 1s;
}
section.visible {
opacity: 1;
-webkit-transform: translate(0, 0);
transform: translate(0, 0);
}
/* ---------------------- */
I'm unable to tell if the edited code works on Safari as yet because of this error. It was working fine on Chrome and Firefox. Any help appreciated.
UPDATE -
Console error reading -
Just replace the 4 last lines of your js file from :
by
Here you go with correct syntax
Hope this will help you.