4

基础工具提示不起作用。我认为脚本放置是错误的，但我无法弄清楚实际问题是什么。是否必须为 javascript 初始化工具提示，还是仅基于 CSS？

这是我放在结束正文标记上方的脚本

<script>
  document.write('<script src=' +
  ('__proto__' in {} ? 'js/vendor/zepto' : 'js/vendor/jquery') +
  '.js><\/script>')
  </script>

  <script src="js/foundation.min.js"></script>
  <script src="../js/foundation/foundation.section.js"></script>
  <script src="js/foundation/foundation.topbar.js"></script>

<script>
  $(document).foundation();
  $(document).foundation('orbit', {
    animation: 'fade'
    timer_speed: 3000,
    pause_on_hover: false,
    resume_on_mouseout: false,
    animation_speed: 300,


  });

  $(".orbit-timer").hide();
  $(".orbit-slide-number").hide();
</script>

我已经解决了与此相关的其他问题，但找不到正确的答案！

这是工具提示的 html

<span data-tooltip class="has-tip" title="Tooltips are awesome, you should totally use them!">extended information</span>
4

1 回答 1

2

custom.modernizr.js如果您使用的是foundation 4 ，我看到您没有包含foundation.tooltips.js在您的页面中。

现代化：

在页面的头部添加 Modernizr。Modernizr 充当旧浏览器的 HTML5 元素的填充物以及移动设备的检测。

请参阅： http: //foundation.zurb.com/docs/javascript.html和http://foundation.zurb.com/docs/components/tooltips.html

演示：http: //jsfiddle.net/IrvinDominin/4jaEa/

编辑

,您的轨道功能不起作用，因为选项后缺少一个animation轨道设置必须在$(document).foundation()执行之前完成。

代码：

$(document).ready(function () {
        $(document).foundation('orbit', {
        animation: 'fade',
        timer_speed: 3000,
        pause_on_hover: false,
        resume_on_mouseout: false,
        animation_speed: 300
    });

    $(document).foundation();

    $(".orbit-timer").hide();
    $(".orbit-slide-number").hide();

});

演示：http: //jsfiddle.net/IrvinDominin/SdAkp/

于 2013-09-25T10:26:57.780 回答