1

我正在尝试让 Foundation 5 的 Interchange(带有 HTML 部分)工作,但部分没有加载。Foundation5、jQuery 和 Interchange 位于

/bower_components/

index.html 位于

/src/

small.html、medium.html 和 large.html 部分位于

/src/app/nav/


以下是相关文件:

index.html</body>在*之前的底部包含 javascripts

<!-- build:js(.) scripts/vendor.js -->
<!-- bower:js -->
<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/jquery.cookie/jquery.cookie.js"></script>
<script src="bower_components/jquery-placeholder/jquery.placeholder.js"></script>
<script src="bower_components/foundation/js/foundation.js"></script>
<script src="bower_components/foundation/js/foundation/foundation.interchange.js"></script>
<!-- endbower -->
<!-- endbuild -->

交换-test.html

<div data-interchange="[small.html, (small)], [medium.html, (medium)], [../large.html, (large)]">
    <div data-alert class="alert-box secondary radius">
        This is the default content.
    </div>
</div>

应用程序.scss

/* Define mobile styles */
@media only screen { 
    body {
        background: red;
    }
}

/* min-width 641px, medium screens */
@media only screen and (min-width: 40.063em) { 
    body {
        background: orange;
    }
}

/* min-width 1025px, large screens */
@media only screen and (min-width: 64.063em) { 
    body {
        background: yellow;
    }
}

关于这里有什么问题的任何想法?提前致谢。

4

1 回答 1

1

我通过添加$(document).foundation('interchange', 'reflow');到我的index.html解决了这个问题,并且我通过../app/nav/在文件名之前添加来更改部分路径,就像这样

<div data-interchange="[../app/nav/small.html, (small)], [../app/nav/medium.html, (medium)], [../app/nav/large.html, (large)]">
<div data-alert class="alert-box secondary radius">
    This is the default content.
</div>

这是关于 Foundation 回流的讨论http://foundation.zurb.com/forum/posts/1712-bind-foundation-5-clearing-to-dynamically-loaded-images

于 2014-12-03T14:43:20.543 回答