4

I want to use a Foundation tooltip: http://foundation.zurb.com/docs/components/tooltips.html

According to the instructions: I put this code in body :

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

and use:

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

and:

<script>
  $(function(){
    $(document).foundation();    
  })
</script>

and I use this code in body

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

But it does not work:

upload.tehran98.com/img1/6taveochivfnio6ch6h2.png

Now what do I do to have tooltip like this?

upload.tehran98.com/img1/zkmxqt8nqvkbnyn4bd.png

4

4 回答 4

4

我没有使用：

<script src="/js/custom.modernizr.js"></script>

并且没有下载 CSS： http: //foundation.zurb.com/download.php

我现在使用它们和工具提示：

在此处输入图像描述

于 2013-05-16T04:51:04.957 回答
2 
<!doctype html>
<head>
<link rel="stylesheet" href="css/foundation.css" />
<script src="js/vendor/jquery.js"></script>
<script src="js/foundation/foundation.js"></script>
<script src="js/foundation/foundation.tooltip.js"></script>
<script src="js/modernizr.min.js"></script>
</head>
<body>
<script src="/js/foundation.min.js"></script>
<script>
  $(function(){
    $(document).foundation();    
  })
</script>
<span data-tooltip class="has-tip" title="Tooltips are awesome, you should totally use them!">extended information</span>
</body>
</html>
于 2014-06-20T10:23:50.623 回答
1

我通过将modernizr.js 放在基础脚本文件夹中并在页面的head 部分调用modernizr.js 来解决它。

<script src="~/Scripts/foundation/modernizr.js"></script>

所有工作的魅力！

于 2014-09-12T10:55:20.383 回答
1

我遇到了与@naser 相同的问题，这是我解决问题的方法：

我的第一个问题是我的网站上没有运行modernizr。在<head>页面部分添加 Modernizr：

<script src="/js/vendor/modernizr.js"></script>

如果您的 Foundation 文件安装正确，这应该可以工作，但由于某种原因我的不是。所以我使用CDNJS中的文件来安装modernizr：

<script src="//cdnjs.cloudflare.com/ajax/libs/foundation/5.0.2/js/modernizr.js"></script>

如果您不想使用 CDNJS 中的文件，那么您应该导航到 Foundation/js 文件夹并查看文件（modernizr.js、foundation.js 等）是否在其中。如果他们没有尝试检查 bower_components 文件夹，然后将它们复制到 Foundation/js 文件夹。如果您在任何地方都找不到它们，请尝试重新安装 Foundation。

这对我很有用。希望这可以帮助。

于 2014-06-04T20:37:04.140 回答