我一直在使用instafeed.js(http://instafeedjs.com/)为我的网页制作Instagram Feed。
它工作,显示我需要的图像和任何数据,但jQuery无法识别instafeed.js创建的对象(在“模板”上定义的对象)。
<body>
<div id="instafeed"></div>
<script>
var userFeed = new Instafeed({
get: 'user',
userId: '**********',
accessToken: '*************************',
resolution: 'standard_resolution',
template: '<img src="{{image}}"/> <div id="hover"><p>{{caption}}</p></div>'
});
userFeed.run();
</script>
<script>
$("#hover").hover(function(){
$(this).fadeOut(40);
$(this).fadeIn(80);
});
</script>
</body>
答案 0 :(得分:0)
以下是您的代码中的一些问题。
1.hover函数不会绑定到动态创建的元素。
2.hover也已弃用,您需要.on()
使用mouseenter
。
3.在您的情况下,最好使用它最好使用mouseleave
var userFeed = new Instafeed({
get: 'user',
userId: '<enter your user id>',
accessToken: '<enter acess token>',
resolution: 'standard_resolution',
template: '<img src="{{image}}"/> <div class="hover"><p>{{caption}}</p></div>'
});
userFeed.run();
$('body').on("mouseenter", ".hover", function() {
// hover starts code here
$(this).fadeOut(40);
});
$('body').on("mouseleave", ".hover", function() {
// hover ends code here
$(this).fadeIn(80);
});
以下示例代码将帮助您屏蔽用户ID和访问令牌 你需要更换它。
<div id="instafeed"></div>
</body>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/instafeed.js/1.4.1/instafeed.min.js"></script>
Python