私はapi、javascriptを使用することに関する知識はほとんどありません。 (私はhtml/cssコーダーです)Instagram apiが動作していません
このAPIを使用して、ユーザーが特定のハッシュタグを使用して投稿した図表ピクチャ を取得するように要求されました。ここで
はjsfiddle 私の場合はhttp://jsfiddle.net/j9ynxvox/10/
$(function() {
// 「表示」を押すと、画像を取得します
var endpoint = 'https://tagplus.jp/demo/api/json/medias';
// ポップアップ用の関数
var popup = function(item) {
var $container = $('<div>', {'class': 'popup-container'});
$('<div>', {'class': 'popup-overlay'}).appendTo($container);
var $template = $($('#popup-template').html());
$template.find('.popup-image').attr('src', item.images.standard_resolution);
var userLink = 'https://instagram.com/' + item.media_user.username;
$template.find('.user-link').attr('href', userLink);
$template.find('.profile-picture')
.attr('src', item.media_user.profile_picture);
$template.find('.media-user-name').text(item.media_user.username);
$template.appendTo($container);
$('body').append($container);
$container.fadeIn();
};
$(document).on(
'click',
'.popup-overlay',
function(e) {
e.preventDefault();
$('.popup-container').fadeOut(
'fast',
function() {
$(this).remove();
}
);
}
);
$('button').click(function() {
$('#thumbnail').text('');
$.get(
endpoint,
{count: 12},
function(res) {
res.data.forEach(function(item) {
var $thumb = $('<img>', {
'class': 'insta-thumb',
src: item.images.thumbnail
});
$thumb.appendTo($('#thumbnails'));
$thumb.click(function(e) {
e.preventDefault();
popup(item);
});
});
},
'jsonp'
);
});
$(document).keyup(function(e) {
if (e.keyCode === 27) {
$('.popup-container').fadeOut(
'fast',
function() {
$(this).remove();
}
);
}
});
});
によって共有されていますデモだ、私は、このAPIのアドレスを使用するように求めてきました。 https://tagplus.jp/plazastyle_Campaign/api/json/medias (その呼ばhttp://tagplus.jp/)
オフを開始するには、私は単純にコピーして自分のローカルファイルにこのjsfiddleコード を貼り付けたが、私は写真をInstagramのロードするためのボタンをクリックしたときに、それが機能していません。テスト パス:ny2016
なぜそれが動作していないと私はこれをどのように修正することができ
は、ここに私のデモ http://1ne-studio.com/test2/sample.html IDですか?
ありがとうございました! (私の場合、私はこのAPIのアドレスを使用するように求めてきたhttps://tagplus.jp/plazastyle_Campaign/api/json/medias。)
感謝をしてみてください。それは私の愚かだった。しかし、jqueryを追加してもまだ動作していません.... –
http://1ne-studio.com/test2/sample.htmlでデモを更新できますか? –
ありがとうございました!私はちょうど更新した!チェックしてください! –