flickr feed returning - "resource interpreted as Other but transferred with MIME type undefined"

[GoogleCodeExporter]

What steps will reproduce the problem?
1. JSON jquery call
2.
3.

What is the expected output? What do you see instead?
A functioning slideshow but instead only thumbnails load.

What version of the product are you using? On what operating system?
Galleriffic 2.0; jquery 1.6.1

Please provide any additional information below.

Greetings,

I am trying to pull images from flickr to a galleriffic gallery. The images are 
retrieved and are visible through "Resources" under developer tools but the 
undefined resource - still not sure what this is - will further produce, 
"uncaught typeError: Cannot read property 'index' of undefined."

I've substituted images on local server and galleriffic works fine - it's only 
the images from flickr that causes this issue.

Here is the coding:

HTML

<div id="mediaphotos">
    <div id="thumbs" class="pnavigation">
        <a class="pageLink prev" href="#" title="PreviousPage"></a>
        <ul class="thumbs" id="pinsert">
        </ul>
        <a class="pageLink next" href="#" title="NextPage"></a>
    </div>
</div>
<div class="pcontent">
    <div class="slideshow-container">
        <div id="controls" class="controls"></div>
        <div id="loading" class="loader"></div>
        <div id="slideshow" class="slideshow"></div>
    </div>
</div>
<script type="text/javascript" 
src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript" src="/js/jquery.galleriffic.js"></script>
<script type="text/javascript" src="/js/jquery.opacityrollover.js"></script>

SCRIPT

<script type="text/javascript">
$.getJSON("http://api.flickr.com/services/rest/?method=flickr.photosets.getPhoto
s&api_key=XXXXXXXXXXXX&photoset_id=XXXXXXX&per_page=5&page=1&format=json&jsoncal
lback=?", function(data) {
    $.each(data.photoset.photo, function(i,item) {
        var photoURL = 'http://farm' + item.farm + '.staticflickr.com/' + item.server + '/' + item.id + '_' + item.secret + '_t.jpg'; 
        var fullURL = 'http://farm' + item.farm + '.staticflickr.com/' + item.server + '/' + item.id + '_' + item.secret + '.jpg';
        $("<img/>").attr("src",photoURL).appendTo("#pinsert").wrap("<li/>").wrap("<a class='thumb' href='" + fullURL + "'></a>");
        });
    });
    </script>

and the rest is from the example @ GALLERIFFIC

<script type="text/javascript">
        jQuery(document).ready(function($) {
                $('div.pcontent').css('display', 'block');

                var onMouseOutOpacity = 0.67;
                $('#thumbs ul.thumbs li, div.pnavigation a.pageLink').opacityrollover({
                    mouseOutOpacity:   onMouseOutOpacity,
                    mouseOverOpacity:  1.0,
                    fadeSpeed:         'fast',
                    exemptionSelector: '.selected'
                });

                var gallery = $('#thumbs').galleriffic({
                    delay:                     2500,
                    numThumbs:                 7,
                    preloadAhead:              7,
                    enableTopPager:            false,
                    enableBottomPager:         false,
                    imageContainerSel:         '#slideshow',
                    controlsContainerSel:      '#controls',
                    captionContainerSel:       '#caption',
                    loadingContainerSel:       '#loading',
                    renderSSControls:          true,
                    renderNavControls:         true,
                    playLinkText:              'Play Slideshow',
                    pauseLinkText:             'Pause Slideshow',
                    prevLinkText:              '&lsaquo; Previous Photo',
                    nextLinkText:              'Next Photo &rsaquo;',
                    nextPageLinkText:          'Next &rsaquo;',
                    prevPageLinkText:          '&lsaquo; Prev',
                    autoStart:                 false,
                    syncTransitions:           true,
                    defaultTransitionDuration: 900,
                    onSlideChange:             function(prevIndex, nextIndex) {
                        // 'this' refers to the gallery, which is an extension of $('#thumbs')
                        this.find('ul.thumbs').children()
                            .eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end()
                            .eq(nextIndex).fadeTo('fast', 1.0);

                        // Update the photo index display
                        this.$captionContainer.find('div.photo-index')
                            .html('Photo '+ (nextIndex+1) +' of '+ this.data.length);
                    },
                    onPageTransitionOut:       function(callback) {
                        this.fadeTo('fast', 0.0, callback);
                    },
                    onPageTransitionIn:        function() {
                        var prevPageLink = this.find('a.prev').css('visibility', 'hidden');
                        var nextPageLink = this.find('a.next').css('visibility', 'hidden');

                        // Show appropriate next / prev page links
                        if (this.displayedPage > 0)
                            prevPageLink.css('visibility', 'visible');

                        var lastPage = this.getNumPages() - 1;
                        if (this.displayedPage < lastPage)
                            nextPageLink.css('visibility', 'visible');

                        this.fadeTo('fast', 1.0);
                    }
                });

                /**************** Event handlers for custom next / prev page links **********************/

                gallery.find('a.prev').click(function(e) {
                    gallery.previousPage();
                    e.preventDefault();
                });

                gallery.find('a.next').click(function(e) {
                    gallery.nextPage();
                    e.preventDefault();
                });
});
</script>

Thank you for your assistance!

Original issue reported on code.google.com by aay...@gmail.com on 5 Dec 2011 at 8:40