Untuk sekali lagi saya akan mengupas tentang Data Json Flicker berupa hasil dari pencarian dengan kata kunci tertentu sehingga akan ditampilkan pada HTML, kita akan menampilkan Json data tersebut dengan menggunakana metode Jquery, lihat contoh script Jquery berikut :
<div id="result"/>
<script>
var keyword = 'mountain';
var apikey = 'YourApiFlicker';
var limit = '5';
var outdiv = 'result';
$( document ).ready(function() {
getImg(keyword,apikey,limit,outdiv);
});
</script>
<script type="text/javascript">
function getImg(query,api,limited,divOut)
{
var url = "https://api.flickr.com/services/rest/?method=flickr.photos.search&api_key="+api+"&tags="+query+"&safe_search=1&per_page=5";
$.getJSON(url + "&format=json&jsoncallback=?", function(data){
$.each(data.photos.photo, function(i,item){
src = "http://farm"+ item.farm +".static.flickr.com/"+ item.server +"/"+ item.id +"_"+ item.secret +"_m.jpg";
//$("<img/>").attr("src", src).appendTo("#fbimage");
$("#"+divOut).append($("<img/>").attr("src", src));
if ( i == limited ) return false;
});
});
}
</script>
Smoga sobat semua bisa berkreasi dari contoh di atas....happy blogging !
ConversionConversion EmoticonEmoticon