Javascript Instafeed.js上一个按钮
这是我的问题。我正在努力让我的网站的Instagram订阅生效。它是Instafeed.js。我正在试着让上一个按钮工作。我见过一个示例,其中Instafeed.js使用了“上一个按钮”: 在我目前的网站上,我得到了Instagram的照片,我的下一个按钮工作,但我的上一个按钮不工作,似乎有一个JavaScript错误。例如,如果我使用CSS,例如:Javascript Instafeed.js上一个按钮,javascript,jquery,instafeedjs,Javascript,Jquery,Instafeedjs,这是我的问题。我正在努力让我的网站的Instagram订阅生效。它是Instafeed.js。我正在试着让上一个按钮工作。我见过一个示例,其中Instafeed.js使用了“上一个按钮”: 在我目前的网站上,我得到了Instagram的照片,我的下一个按钮工作,但我的上一个按钮不工作,似乎有一个JavaScript错误。例如,如果我使用CSS,例如: #instafeed img:hover {opacity: .3;} 它工作得很好,但是如果我使用jQuery,它就不工作了。例如: $(‘#
#instafeed img:hover {opacity: .3;}
它工作得很好,但是如果我使用jQuery,它就不工作了。例如:
$(‘#instafeed img’).click(function(){
$(this).css(“opacity”, .3);
});
下面是我用来访问Instafeed.js的JavaScript代码:
var instaInfo = '<span class="text"><p><b>{{likes}} ♥</b> Likes <br> {{comments}} Comments</p><a class="fancybox" href="{{link}}" target="_blank"><img src="{{image}}" /></a></span>';
var loadButton = document.getElementById('load-more');
var feed = new Instafeed({
get: 'tagged',
tagName: 'signalcity',
clientId: '528ab0876c9f4db8889acc36da952b4f',
limit: 4,
links: 'true',
resolution: 'standard_resolution',
template: instaInfo,
sortBy: 'most-recent',
after: function() {
if (!this.hasNext()) {
loadButton.setAttribute('disabled', 'disabled');
}
}
});
feed.run();
以下是HTML:
<div id="instafeed">
<div id="instaClick">
<a class="next"><h5>NEXT >></h5></a>
<a class="prev"><h5><< PREVIOUS</h5></a>
</div>
</div>
下一步>>
加载instagram提要后,应立即注册事件处理程序,因为动态加载了
元素并将其附加到#instafeed
包装中,因此在加载页面时不会注册任何事件
可以在feed元素的之后使用选项注册事件:
var feed=new Instafeed({
得到:“标记”,
标记名:“信号城市”,
客户ID:'528ab0876c9f4db8889acc36da952b4f',
限额:4,
链接:“正确”,
决议:“标准决议”,
模板:instaInfo,
脏话:“最近的”,
之后:函数(){
如果(!this.hasNext()){
loadButton.setAttribute('disabled','disabled');
}
$(“#instafeed img”).mouseover(函数(){
$(this.css(“不透明度”,.3);
});
$(“#instafeed img”).mouseout(函数(){
$(this.css(“不透明度”,100);
});
}
});
<div id="instafeed">
<div id="instaClick">
<a class="next"><h5>NEXT >></h5></a>
<a class="prev"><h5><< PREVIOUS</h5></a>
</div>
</div>