javascript – 基础工具提示无效.关于这个问题的任何想法？

2019年7月21日 179次阅读

基础工具提示不起作用.我认为脚本放置是错误的,但我无法弄清楚实际问题是什么.是否必须为
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,我看到你没有在你的页面中包含custom.modernizr.js和foundation.tooltips.js.

Modernizr的：

In the head section of your page add Modernizr. Modernizr acts as a
shim for HTML5 elements for older browsers as well as detection for
mobile devices.

见：http://foundation.zurb.com/docs/javascript.html和http://foundation.zurb.com/docs/components/tooltips.html

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

编辑

您的轨道功能不起作用,因为在动画选项之后有一个缺失,并且必须在执行$(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/

点赞