Jquery variable

Question

I have an external Jquery code that looks like that :

jQuery(function($){
 $.supersized({
 navigation : 1, //Slideshow controls on/off
 thumbnail_navigation : 1, //Thumbnail navigation
 slide_counter : 1, //Display slide numbers
 slide_captions : 1, //Slide caption (Pull from "title" in slides array)
 slides : [
 {image : 'some/path', title : 'title'},
 {image : 'some/path', title : 'title'}, 
 {image : 'some/path', title : 'title'}
 ] //Slide Images to be specified on page
 }); 
});

Can I replace the 'slides' optio by some variable like $slide_urls and declare the image paths on individual html pages?

Answer 1

As long as the variable $slide_urls is declared somewhere that would be visible inside the supersized() function and it is an array of objects, you can easily set it elsewhere in the page and have it referenced in your function:

$(window).ready(function(){
 $slide_urls = [ /* specific slides for the page */ ];
 // ... other code
 $.supersized({
 // other options
 slides: $slide_urls
 }
}

Answer 2

It would be possible if you declare slide_urls as global variable.

However, imo it is better to put this code in its own function and call it from the pages, passing in the right data:

// in your "external" code:
function setup(urls) {
 $.supersized({
 //...
 slides: urls
 });
}
// in the pages
$(function() {
 setup([/*...urls here...*/]);
});