Polymerjs iron-dropdown元素 _Polymerjs元素

【Polymerjs iron-dropdown元素】< iron-dropdown> 元素用于显示隐藏的下拉菜单内容。使用铁下拉菜单的元素实现可以具有组合框, 菜单按钮, 选择等。
< iron-dropdown> 元素显示相对于.dropdown-content位置配置的.dropdown-trigger的属性。
例子
打开命令提示符, 并使用以下命令转到你的项目文件夹以实现iron-dropdown元素：

bower install PolymerElements/iron-dropdown -save

文章图片

< !DOCTYPE html> < html> < head> < title> iron-dropdown< /title> < base href = "http://polygit.org/components/"> < script src = "http://www.srcmini.com/webcomponentsjs/webcomponents-lite.min.js"> < /script> < link rel = "import" href = "http://www.srcmini.com/iron-dropdown/demo/x-select.html"> < link rel = "import" href = "http://www.srcmini.com/paper-input/paper-input.html"> < link rel = "import" href = "http://www.srcmini.com/paper-button/paper-button.html"> < style> .dropdown-trigger{background-color: DarkCyan ; border-radius: 4px; color: white; }.dropdown-content {background-color: white; line-height: 15px; border-radius: 5px; box-shadow: 0px 2px 5px #ccc; padding: 20px; }< /style> < /head> < body> < h3> Iron-dropdown Example< /h3> < x-select> < paper-button class = "dropdown-trigger"> Click Me !< /paper-button> < div class = "dropdown-content"> < p> Hello !!! < br/> < p> This is an iron-dropdown < br/> example of Polymerjs.< /p> < /div> < /x-select> < /body> < /html>

输出