CODEWITHSUNDEEP
jqueryhtmlwordpress
Megan
Megan

Reputation: 28

My jquery has stopped working

My .js file seems to have stopped showing any results and I'm not sure why it has stopped working? I have removed any wordpress plugins that I had added thinking they might have been conflicted but that doesn't seem to have made any difference.

You can see my website here http://mhutchinson.me.uk/

As you can see, if you scroll down, the masonry script and the text replacement for the category has stopped working which are on the same .js file.

The file can be found here http://mhutchinson.me.uk/wp-content/themes/twentyeleven/js/script.js

Hope someone can help!

Upvotes: 0

Views: 290

Answers (3)

pete
pete

Reputation: 25091

Try initializing the carousel first and then chaining on the cycle method:

$(document).ready(function () {
    $('.carousel').carousel({
        interval: 1000
    }).carousel('cycle');
});

UPDATE:

I am only getting two errors when I load the page:

  1. 404 not found on http://mhutchinson.me.uk/wp-content/themes/twentyeleven/img/glyphicons-halflings.png
  2. GET is failing on https://apis.google.com/js/plusone.js (because Google +1 is blocked by my AVG browser extension)

and the carousel has stopped working (because the script is no longer on the page, or linked to the page as an external .js file).

Upvotes: 0

thescientist
thescientist

Reputation: 2948

In your console, as pointed out earlier, the issue is a JS error on line 31 where you are trying to call carousel.

The problem is that you are calling the carousel as the page is loaded, which in your case, is before .carousel as a DOM element has been loaded.

JS/Jquery best practices state that you put all your code that has dependancies on DOM elements in a window.onload handler, or in the case of jquery, use ready. 

window.onload = function(){
  $('.carousel').carousel('cycle')({
    interval: 1000
  })
}

or

$(document).ready(function(){
  $('.carousel').carousel('cycle')({
    interval: 1000
  })
})

upon further investigation, the issue is conflicting libraries using $. jQuery.noConflict should be used. jQuery.noConflict

Upvotes: 1

McNab
McNab

Reputation: 6777

You can use the console in Chrome (F12) or Firebug to view Javascript errors. In this case it is Uncaught Type Error: object is not a function relating to this piece of code you've added to your head;

 <script>
   $('.carousel').carousel('cycle')({
   interval: 1000
   })
 </script>

Upvotes: 0

Related Questions