jQuery Slimbox is not requesting files correctly

Question

I am using jQuery slimbox with it's API.

Here is my JavaScript that gets image paths via JSON, and then launches the slimbox via it's API.

$('#main-container').append('<span id="check-our-adverts">Check our Adverts</span>');

    var advertImages = [];
    $.getJSON( config.basePath + 'get-adverts/', function(images) {
       advertImages = images;
    });

    $('#check-our-adverts').click(function() {
        console.log(advertImages);
        $.slimbox(advertImages, 0);    
    });

The JSON is returning ["\/~wwwlime\/assets\/images\/adverts\/advert.jpg","\/~wwwlime\/assets\/images\/adverts\/advert2.jpg"].

The actual page is here. Click top red box next to the frog. If you have a console, check it for the JSON returned.

When I view the request using Live HTTP Headers, it seems slimbox is requesting vanquish.websitewelcome.com/ and nothing else.

This is resulting in the slimbox being launched, and it's throbber spinning forever.

What could be causing this problem? Thanks

Update

I added this inside the JSON callback

 $.each(images, function(i, image) {
        $('body').append('<a href="' + image + '">link</a>');
       });

And clicking those links takes me directly to the image... what gives?

Answer 1

I am not 100% familiar with slimbox but the api says that the method takes and array of arrays, so your return from JSON should, i believe, look more like

[["\/~wwwlime\/assets\/images\/adverts\/advert.jpg"],["\/~wwwlime\/assets\/images\/adverts\/advert2.jpg"]]

making you call to slimbox

$.slimbox( [["\/~wwwlime\/assets\/images\/adverts\/advert.jpg"],["\/~wwwlime\/assets\/images\/adverts\/advert2.jpg"]],0);

let me know if that helps?