带getJSON的flexslider插件我不能让它工作吗?

时间:2013-09-22 19:57:58

标签: jquery

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');
   });

1 个答案:

答案 0 :(得分:1)

您正在div内的ul而不是div本身初始化flexslider。 改变

$('.flexslider .slides').flexslider(...

$('.flexslider').flexslider(...