如何动态加载基础轨道

How to dynamically load foundation orbit?

本文关键字：加载 轨道 动态 何动态      更新时间：2023-09-26

在我的javascript中，如果窗口是一个特定的宽度，将data-orbit属性添加到我的滑动条。这对$(window).resize()和$(function(){})开火。

浓缩版…

   var ui = {
        mobile : function() {
            var i = 0;
            if($(window).width() <= 568) {
                this.resizeOffers();
            } else {
                this.mobileClear();
            }
        },
        resizeOffers : function() {
                $('#offers .inner').attr('data-orbit', "");
        },
        mobileClear : function() {
                $('#offers .inner').removeAttr('data-orbit');
        }
    }

如果你加载页面，而窗口宽度符合条件，一切都很好。如果你用一个正常的窗口宽度加载页面，然后调整大小到媒体查询，显然轨道没有加载的dom，所以没有滑块动画或动态添加轨道dom元素。

我的问题是……

我如何让轨道操纵dom，文档加载后?或者这是不可能的?

谢谢,
赛斯

考虑到这一点，你可以使用ajax加载轨道js，然后在dom准备好后启动它。

 $(document).ready(function(){
   //load the orbit JS
   $.ajax({
     url: 'js/foundation/foundation.orbit.js',
     dataType: 'script',
     success: function(){
       //initiate orbit
       console.log('loaded');
       $(document).foundation('orbit');
     },
     async: false
   });
});

事后发现，如果轨道加载，运行…$(document).foundation('orbit');在我的js媒体查询做了相同的上面，没有任何HTTP请求。

相关文章：