CODEWITHSUNDEEP
jquery
maccaj51
maccaj51

Reputation: 37

Calling content before jquery plugin

I have this jquery code where I want to load content and then trigger a plugin. Can some one please assist me as its not working and I'm not proficient enough to debug myself!!

$(document).ready(function() {
$('#scoop-container ul').load('/test.html');

$("#scoop-container ul").carouFredSel({
    direction: "up",
    height: "variable",
    height: 1000,
    items: {
        start: "random"
    },
    scroll: 1
});
});

Upvotes: 1

Views: 330

Answers (4)

sidneydobber
sidneydobber

Reputation: 2910

('/test.html');

I suspect the path is the problem. Adding the slash to the front part will make your application search for the file in the root of your site. Check if the path is correct. I checked the function call which should be fine.

Upvotes: 0

avramov
avramov

Reputation: 2114

Put the function call in the callback of the .load().

$(document).ready(function() {
    $('#scoop-container ul').load('/test.html',null,function(){
        $("#scoop-container ul").carouFredSel({
             direction: "up",
             height: "variable",
             height: 1000,
             items: {
                start: "random"
             },
             scroll: 1
        });
    });
});

See here: http://api.jquery.com/load/. Most jQuery functions are like this - they have a parameter called callback where you can write an entire function to be executed when the previous one is complete. You can also nest them - quite convenient, but it can look pretty messy with all those indents.

Upvotes: 1

Johan
Johan

Reputation: 35194

I would say, load it in the callback:

$('#scoop-container ul').load('/test.html', function(){
    //do the carouFredSel stuff
});

Upvotes: 1

David Hellsing
David Hellsing

Reputation: 108500

You need to add the code in the callback function (second argument):

$(document).ready(function() { 
  $('#scoop-container ul').load('/test.html', function() {
    $("#scoop-container ul").carouFredSel({ direction: "up", height: "variable", height: 1000, items: { start: "random" }, scroll: 1 }); });
  });
});

The callback function is executed when the request completes.

Upvotes: 3

Related Questions