flexslider无法使用我的getJSON响应:(任何想法为什么? 是关于flexslider我应该知道的事情,或者你们知道其他的滑块工具包对这种类型更好吗?
HTML
<body>
<div class="flexslider">
<ul class="slides">
</ul>
</div>
<script id="gallery" type="insta/template">
<li><img src={{link}} alt=""/></li>
</script>
</body>
jquery的
function fetchingPhotos(tag) {
return $.ajax({
url: "https://api.instagram.com/v1/tags/" + tag + "/media/recent?client_id=c1302f417cda4e09968eaec958fe0ae2&callback=?",
//data: {q: data},
dataType: 'jsonp'
});
};
function toStage(photos) {
template = $('#gallery').html();
var photoBox = ' ';
$.each(photos.data, function (index, value) {
var obj = value.images.low_resolution.url;
photoBox += template.replace(/{{link}}/, obj)
});
$('.flexslider .slides').append(photoBox);
// $('#album ul li').css('border', '1px solid red');
};
function flex(){
$('.flexslider .slides').flexslider({
animation: "slide",
smoothHeight: true // auto-adjust to fit the height of images
});
};
$.when(fetchingPhotos('cats') ).done(function(results1){
toStage(results1)
console.log('1');
flex();
console.log('2');
});
答案 0 :(得分:1)
您正在div内的ul
而不是div
本身初始化flexslider。
改变
$('.flexslider .slides').flexslider(...
到
$('.flexslider').flexslider(...