Question

我似乎无法让<paper-tooltip>元素为我工作。

我做错了什么？

<!doctype html>
<head>
  <meta charset="utf-8">
  <base href="http://polymer-magic-server.appspot.com/components/">
  <script src="webcomponentsjs/webcomponents-lite.min.js"></script>
  <link href="polymer/polymer.html" rel="import">
</head>
<body>

  <dom-module id="x-foo">
    <template>
      <style></style>
        <div class="with-tooltip" tabindex="0">
          <input type="checkbox">Oxygen
          <paper-tooltip>Atomic number: 8</paper-tooltip>
        </div>
        <paper-icon-button id="heart" icon="favorite" alt="heart"></paper-icon-button>
        <paper-icon-button id="back" icon="arrow-back" alt="go back"></paper-icon-button>
        <paper-icon-button id="fwd" icon="arrow-forward" alt="go forward"></paper-icon-button>
        <paper-tooltip for="heart" margin-top="0">&lt;3 &lt;3 &lt;3 </paper-tooltip>
        <paper-tooltip for="back" margin-top="0">halp I am trapped in a tooltip</paper-tooltip>
        <paper-tooltip for="fwd" margin-top="0">back to the future</paper-tooltip>
    </template>
    <script>

      // only need this when both (1) in the main document and
      // (2) on non-Chrome browsers
      addEventListener('WebComponentsReady', function() {

        Polymer({
          is: "x-foo"
        });

      });

    </script>
  </dom-module>

  <x-foo></x-foo>

</body>

Answer 1

评论摘要：

Per @kevinashcraft：

您必须导入纸质图标按钮，铁图标和纸张工具提示。 Here's a working JSBin

聚合物1.0：纸 - 工具提示不起作用

1 个答案: