This summer I started a web design internship, mainly doing html and css, the other day my boss told me to learn jquery and use json to create a sort of gallery type thing.
The idea is: I add an entry into a json file, for every entry in the json file I put a small square at the bottom of the screen, and when you press that button some image and text above update.
I BS'ed my way through some of it, most of it I think is a test so he can see what I can do, so I'm not looking for answers, just an explanation of what I'm doing.
Here is what I've been using as "json":
Code:
var gallery_content = {
"content" : [
{
"text" : "Text for image 1",
"image" : "gallery_image_00.jpg"
},
{
"text" : "Text for image 2",
"image" : "gallery_image_01.jpg"
}
]
}
and then this is the script I'm using in addition to jQuery 1.3.2, eplaination will follow
Code:
$(document).ready(function(){
// when I click a button, assign variable based on the button...
$("div.gallery_button").click(function() {
var gallery_id = this.id.slice(15);
//...then load text and image
$('#gallery_text_area').html(gallery_content.content[gallery_id].text);
$('#gallery_image').css("background-image",'url(' + gallery_content.content[gallery_id].image + ')');
});
});
> User clicks a small square div at the bottom with an id of "gallery_select_##".
> A slice function cuts that to just the "##" and assigns it to a variable.
> Then inserts it into the gallery_content.content[##].{text/image} variable from the "json"
> Then that variable, reading e.g., gallery_content.content[1].text, returns the text for that object and puts it into the designated spot.
So did I use json? Can someone explain to me what json is? It seems to me to be just a part of jquery. Thank you for your help.
