1

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

1 回答 1

1

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

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

只是

$('.flexslider').flexslider(...
于 2013-09-23T06:32:12.073 回答