Question

Use HTML&CSS& JavaScript to:

3-4) Write a JQuery Ajax program which can communicate with flicker to get the last pictures taken from any place or related to any concept(s) the user has written in a textbox, say Sydney, train. Some information associated with the image like its topic, time taken, and its link needs to be appeared with it.

3-5) Develop a server which can serve the file you developed in 3-4.

3-6) Add a plugin to the real jQuery library so that when you pass an array of elements to it, the function can move the elements forward and backward repeatedly. Then test your plugin by sending an array of images to it.

Many thanks to anyone who helps me. I really need your help as soon as possible

Answer 1

Please sign up on flicker link: https://www.flickr.com/services/api/ as a developer . It will provide access token which is required to access data securely.  

Next create code to communicate with Ficker. using JQuery with Ajax. Put the search string (#search) as per your need.

Define a variable to hold the flickr api
var flicker_API = "https://api.flickr.com/services/feeds/photos_public.gne?format=json&tags=" + $("#search").val();

$.ajax({
url: flicker_API,
dataType: "jsonp", // jsonp
jsonpCallback: 'jsonFlickrFeed', // add this property
success: function (result, status, xhr) {
$.each(result.items, function (i, item) {
$("<img>").attr("src", item.media.m).appendTo("#outputDiv");
if (i === 5) {
return false;
}
});
},
error: function (xhr, status, error) {
console.log(xhr)
$("#outputDiv").html("Result: " + status + " " + error + " " + xhr.status + " " + xhr.statusText)
}
});