2015-08-15 68 views
2

我似乎无法获得<paper-tooltip>元素为我工作。聚合物1.0:纸张提示不工作

Here is my JSBin

我在做什么错?从评论

<!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>

+2

你正在做的每一件事情都是正确的,你只需要导入'paper-icon-button','iron-icons'和'paper-tooltip'。 [这是一个可用的JSBin](http://jsbin.com/covuro/2/edit?html,output) –

+0

@KevinAshcraft:啊。谢谢。我没有意识到我仍然需要单独导入每个元素。我想我不明白如何使用'魔术服务器'的东西。 – Mowzer

回答