JQuery Isotope Plugin Mysterious Error

I'm currently using a tutorial to learn how to implement a JQuery plugin called "Isotope" in a wordpress theme that I'm building. Here is a link to the tutorial that I'm using: http://www.designlunatic.com/2011/08/isotope-tutorial/#wpcf7-f780-w1-o1

I have referenced the JQuery library in the functions.php file, and I have enqueued it and the isotope.js file (I've also registered this file) using the wp_enqueue_script (and wp_register_script) function. I know these files are being linked to because when I view the source code and click on the links I don't get an error. The files come up and they appear to be linked correctly via the wp_head function.

The problem I'm having is that the script to use isotope is giving me some kind of error in the console.

I've tried a few different methods but the error is usually:

"Uncaught TypeError: Property '$' of object [object Object] is not a function"

The error is referring to the following script contained in the head of the document:

<script type="text/javascript">
        $(document).ready(function() {
            alert('called');
            var $container = $('#content');
            $container.isotope({
                filter: '*',
                animationOptions: {
                    duration: 750,
                    easing: 'linear',
                    queue: false
                }
            });

            $('#nav a').click(function() {
                var selector = $(this).attr('data-filter');
                $container.isotope({
                    filter: selector,
                    animationOptions: {
                        duration: 750,
                        easing: 'linear',
                        queue: false
                    }
                });
                return false;
            });

        });
    </script>

I have tried loading this as a separate script and registering/enqueue-ing it with a dependancy on JQuery which gave me basically the same error. I have also tried replacing '$' with 'JQuery' and placing the '$' inside the parameters for the functions. When I switch that I get this error:

"Uncaught TypeError: Property 'JQuery' of object [object Object] is not a function"

What am I doing wrong here? I've followed the tutorial instructions as close as I can. Please help! Thanks!

Answers


the J in jQuery is not uppercase. its lower case. so, if you change it to jQuery(document).ready(function($){}); , it should work.

The error occurs if you have jQuery noConflict mode enabled somewhere in your code.

The jQuery library included with WordPress is set to the noConflict() mode. See the codex for wp_enqueue_script for more details.

Cheers! :)


Need Your Help

Android , socket.io , Error while handshaking , when connecting to a nodejs server

android node.js sockets socket.io

All I want is connect from my android app to my nodejs server , I'm using genymotion by the way.

SQL Server 2008 Jobs

sql-server sql-server-2008 visual-studio-2012

I have many jobs which run at different scheduled time, I want to make a system which will tell me that Job A ran successfully and Job B failed etc.

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.