JSON image viewer not working in firefox
Posted
by
jarga
on Stack Overflow
See other posts from Stack Overflow
or by jarga
Published on 2012-11-20T22:25:38Z
Indexed on
2012/11/20
23:01 UTC
Read the original article
Hit count: 190
I have tried to find out why JSON is not working in Firefox all over this forum and the internet. It works on tablets, ie, safari. It works on my desktop in firefox. It only does not work after uploading I've tried a few things (commented out), such as mimeType with no solution. I have tried using the $.ajax with no better luck. Firefox had no javascript errors. I'm using jQuery 1.7.
Console.log is printing out the data.
$(document).ready(function(){
jQuery.support.cors = true;
//$.ajaxSetup({ mimeType: "application/json" });
/*$.ajaxSetup({ scriptCharset: "utf-8" , contentType: "application/json; charset=utf-8"}); */
// loading pictures
$.getJSON("intro.json?format=json", function(data){
var links = '';
var imageload = '';
var title = '';
console.log(data)
$.each(data, function(key, item){
links += ' <a href=' + item.image + '>' + key + '</a>';
imageload += '<img src="' + item.image + ' " />';
title += item.alt;
});
$('.introCon').html(imageload);
$('.introCon img').hide();
$('.introCon img:last').fadeIn(500);
$('.introCon img').fadeIn(1000);
rotatePics(2);
});
});
function rotatePics(currentPhoto) {
var numberOfPhotos = $('.introCon img').length;
currentPhoto = currentPhoto % numberOfPhotos;
$('.introCon img').eq(currentPhoto).fadeOut( function() {
// re-order the z-index
$('.introCon img').each(function(i) {
$(this).css(
'zIndex', ((numberOfPhotos - i) + currentPhoto) % numberOfPhotos
);
});
$(this).show();
setTimeout(function() {rotatePics(++currentPhoto);}, 3000);
});
}
Here is the simple JSON from a separate file.
{
"1" : {
"image" : "portfolio/chrpic.png",
"alt" : "Blah.",
"detail": "Quartz"},
"2" : {
"image" : "portfolio/mysspic.png",
"alt" : "Landing page.",
"detail": "Container"},
"3" : {
"image" : "portfolio/decode-pic3.png",
"alt" : "Decode this.",
"detail": "Landing page 2"},
"4" : {
"image" : "portfolio/simple-think-pic.png",
"alt" : "Simple Think",
"detail": "simpilify your life"}
}
© Stack Overflow or respective owner