使 instagram html feed 静态化（Instafeed + Gridrotator）答案

【问题标题】：Make instagram html feed static (Instafeed + Gridrotator)使 instagram html feed 静态化（Instafeed + Gridrotator）
【发布时间】：2014-06-12 19:14:53
【问题描述】：

//** INSTA FEED **/// 

<script type="text/javascript">
        var userFeed = new Instafeed({
            get: 'user',
            userId: ******,
            limit: 28,
            accessToken: '***************',
               template: '<li><a href="{{link}}"><img src="{{image}}" /></a></li>'

        });

        userFeed.run();
</script>

//*** GRIDROTATOR ***//
     <section class="grid">
    <div id="ri-grid" class="ri-grid ri-grid-size-1 ri-shadow">
            <img src="<?php echo get_template_directory_uri(); ?>/images/loadinggrid.gif" class="ri-loading-image">
                    <ul id="instafeed">
                          <HTML IMAGES HERE>
                    </ul>
                </div>
     </section>

        <script type="text/javascript"> 
            $(function() {
        $( '#ri-grid' ).gridrotator( {
                    w320 : {
                        rows : 3,
                        columns : 4
                    },
                    w240 : {
                        rows : 3,
                        columns : 3
                    },
                    nochange : [0,1,2,3],
                    preventClick : false
                } );

            });

        </script>

我想结合 INSTAFEED.JS + GRIDROTATOR.JS 两者都在工作 instafeed 可以拉图像，网格旋转器可以洗牌图像，但只有当我将 STATIC html 放入其中时。有没有办法使 instafeed 从 instagram 中提取的数据成为静态 html。就像你在 php 上回显一些帖子一样？

【问题讨论】：

标签： javascript jquery api instagram

【解决方案1】：

<script type="text/javascript">
        var userFeed = new Instafeed({
            get: 'user',
            userId: ******,
            limit: 28,
            accessToken: '***************',
            template: '<li><a href="{{link}}"><img src="{{image}}" /></a></li>',
            after: function() {
                  $( '#ri-grid' ).gridrotator( {
                    w320 : {
                        rows : 3,
                        columns : 4
                    },
                    w240 : {
                        rows : 3,
                        columns : 3
                    },
                    nochange : [0,1,2,3],
                    preventClick : false
                } );
            }
        });

        userFeed.run();
</script>

【讨论】：

使用 'after' 回调函数，然后从那里加载 gridrotator 函数。