wordpress - Why does jquery Isotope work on my local machine but not online -
on localhost web server these scripts loading , functioning flawlessly, on bluehost account console giving me errors isotope having no object.
code:
<script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/js/jquery.isotope.js"></script> <script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/js/jquery.infinitescroll.js"></script> <script type="text/javascript"> $(window).load(function(){ $.ajaxsetup({ cache: false }); var $container = $('#articlepost'); $container.isotope({ masonry: { columnwidth: $container.width() / 3} }); $(window).smartresize(function(){ $container.isotope({ // update columnwidth percentage of container width masonry: { columnwidth: $container.width() / 3} }); $container.isotope('relayout'); }); }); </script> and here chrome console error:
uncaught typeerror: object [object object] has no method 'isotope' www.theciv.com:92 (anonymous function) www.theciv.com:92 jquery.event.dispatch jquery-1.9.1.js:3074 elemdata.handle
there 2 versions of jquery loaded in page 1.9.1 , 1.8.3.
one loaded in header (1.9.1)
<script type="application/javascript" src="http://www.theciv.com/wp-content/themes/toolbox/js/jquery-1.9.1.js" /></script> another 1 wordpress
<script type='text/javascript' src='http://www.theciv.com/wp-includes/js/jquery/jquery.js?ver=1.8.3'></script> i think reason, remove 1 of them , should work fine
or make compatible jquery.noconflict()
jquery(function($){ $.ajaxsetup({ cache: false }); var $container = $('#articlepost'); $container.isotope({ masonry: { columnwidth: $container.width() / 3} }); $(window).smartresize(function(){ $container.isotope({ // update columnwidth percentage of container width masonry: { columnwidth: $container.width() / 3} }); $container.isotope('relayout'); }); });
Comments
Post a Comment