Javascript 如何使用zurbs foundation'；s轨道滑块？

我一直在努力解决这个问题。如有任何建议/修正，将不胜感激

资料来源：

问题：标题未显示

html（用于动态观察滑块幻灯片）：

……等等

html（用于动态观察滑块标题）：

第1条
第2条
第3条

……等等

html格式的js：

<script type="text/javascript">
   $(window).load(function() {
        $('#featured').orbit({
            bullets: true,
            timer: false,
            captions: true,
            animation: 'fade' 
        });
   });
</script>   

$（窗口）。加载（函数（）{
$（“#特色”）。动态观察({
子弹：是的，
计时器：错误，
标题：对，
动画：“淡入淡出”
});
});

这是因为“img”标记中有“data caption”属性，而不是包装它的“div”。将其更改为以下内容，它应该可以工作

<div data-caption="#htmlCaption1"><img class="art-work" src="art/2.png" alt="" /></div>

<script type="text/javascript">
   $(window).load(function() {
        $('#featured').orbit({
            bullets: true,
            timer: false,
            captions: true,
            animation: 'fade' 
        });
   });
</script>   

<div data-caption="#htmlCaption1"><img class="art-work" src="art/2.png" alt="" /></div>