Fatal编程技术网
  • polymer/
  • Polymer 聚合物1.x：变得简单<；纸张对话框>；工作 问题:

Polymer 聚合物1.x：变得简单<；纸张对话框>；工作 问题:

polymer

Polymer 聚合物1.x：变得简单<；纸张对话框>；工作 问题:,polymer,polymer-1.0,paper-elements,Polymer,Polymer 1.0,Paper Elements,要显示其元素？请提供一个工作的JSFIDLE或JSBin示例 代码 http://jsfiddle.net/gr3uhucf/2/ <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <base href="http://element-party.xyz/"> <script src="bower_components/webcomponentsjs/webc

要显示其
元素？请提供一个工作的JSFIDLE或JSBin示例

代码 http://jsfiddle.net/gr3uhucf/2/ 
<!DOCTYPE html>
<html>  
<head>
  <meta charset="utf-8">
  <base href="http://element-party.xyz/">
  <script src="bower_components/webcomponentsjs/webcomponents-lite.js"></script>
  <link rel="import" href="all-elements.html">
</head>
<body>
  <paper-button data-dialog="dialog">Dialog</paper-button>
  <paper-dialog id="dialog">
    <h2>Dialog Title</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
  </paper-dialog>
</body>
</html>


对话
对话标题
知识产权是一种权利，是一种精英的权利，是劳动和财富的暂时性权利
如果您只想静态查看对话框，可以在HTML（）中添加
openend
属性

代码 http://jsfiddle.net/6x2g4dc5/ 
<!DOCTYPE html>
<html>  
<head>
  <meta charset="utf-8">
  <title>Polymer Bin</title>
  <base href="http://element-party.xyz/">
  <script src="bower_components/webcomponentsjs/webcomponents-lite.js"></script>
  <link rel="import" href="all-elements.html">
</head>
<body>
  <paper-button id="dialog-button" data-dialog="dialog">Dialog</paper-button>
  <paper-dialog id="dialog" modal>
    <h2>Dialog Title</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
  </paper-dialog>
  <script> 
    document.querySelector("#dialog-button")
            .addEventListener("click", function(){
              document.querySelector("#dialog").open()
              });
  </script>
</body>
</html>


聚合物仓
对话
对话标题
知识产权是一种权利，是一种精英的权利，是劳动和财富的暂时性权利

document.querySelector（“对话框按钮”）
.addEventListener（“单击”，函数（）{
document.querySelector（“#dialog”）.open（）
});
这是一个使用聚合物CDN的工作JSFIDLE。这是基于上面的答案。脚本标记看起来不像惯用的聚合代码


：根{
--纸张选项卡选择栏颜色：var（--纸张-浅蓝色-900）；
--纸张标签墨水：var（--纸张-浅蓝色-100）；
--纸张标签：{
颜色：白色；
背景色：var（--paper-浅蓝色-500）；
};
}
对话
对话标题
知识产权是一种权利，是一种精英的权利，是劳动和财富的暂时性权利

document.querySelector（“对话框按钮”）.addEventListener（“单击”，函数（）{document.querySelector（“对话框”）.open（））；

<paper-button id="dialog-button" data-dialog="dialog">Dialog</paper-button>
<paper-dialog id="dialog">
    <h2>Dialog Title</h2>
</paper-dialog>

<script> 
    document.querySelector("#dialog-button").addEventListener("click", 
        function(){
            document.querySelector("#dialog").open();
        });
</script>

<!DOCTYPE html>
<html>  
<head>
  <meta charset="utf-8">
  <title>Polymer Bin</title>
  <base href="http://element-party.xyz/">
  <script src="bower_components/webcomponentsjs/webcomponents-lite.js"></script>
  <link rel="import" href="all-elements.html">
</head>
<body>
  <paper-button id="dialog-button" data-dialog="dialog">Dialog</paper-button>
  <paper-dialog id="dialog" modal>
    <h2>Dialog Title</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
  </paper-dialog>
  <script> 
    document.querySelector("#dialog-button")
            .addEventListener("click", function(){
              document.querySelector("#dialog").open()
              });
  </script>
</body>
</html>

<base href="https://cdn.rawgit.com/download/polymer-cdn/1.5.0/lib/">
<script src="webcomponentsjs/webcomponents-lite.min.js"></script>
<link rel="import" href="iron-icon/iron-icon.html">
<link rel="import" href="iron-icons/iron-icons.html">
<link rel="import" href="paper-button/paper-button.html">
<link rel="import" href="paper-dialog/paper-dialog.html">
<link rel="import" href="paper-checkbox/paper-checkbox.html">
<link rel="import" href="paper-tabs/paper-tabs.html">
<link rel="import" href="paper-toggle-button/paper-toggle-button.html">
<style is="custom-style">
  :root {
    --paper-tabs-selection-bar-color: var(--paper-light-blue-900);
    --paper-tab-ink: var(--paper-light-blue-100);
    --paper-tabs: {
      color: white;
      background-color: var(--paper-light-blue-500);
    };
  }
</style>

<body>
  <paper-button id="dialog-button" data-dialog="dialog">Dialog</paper-button>
  <paper-dialog id="dialog">
    <h2>Dialog Title</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
  </paper-dialog>

    <script> 
        document.querySelector("#dialog-button").addEventListener("click", function(){document.querySelector("#dialog").open()});
    </script>
</body>