我是聚合物新手。 我想建立像Google IO 15网站这样的菜单。
我尝试将核心工具栏添加到core-scroll-header-panel。
<core-scroll-header-panel headermargin="128" condenses headerheight="192" id="core_scroll_header_panel">
<core-toolbar id="core_toolbar" class="tall">
<core-icon-button icon="arrow-back" id="core_icon_button"></core-icon-button>
<div id="div" flex>
<core-item id="core_item2" icon="home" label="Home" horizontal center layout></core-item>
<core-item id="core_item" icon="account-box" label="Our Objectives" horizontal center layout></core-item>
</div>
<div id="div1" class="bottom indent">Title</div>
<core-item id="core_item1" icon="settings" label="Business Activities" horizontal center layout></core-item>
</core-toolbar>
<section id="section" content></section>
</core-scroll-header-panel>
但是这就像下面显示的图像
如何在Google IO 2015网站中获得涟漪效果或悬停效果。
还有其他方法可以实现它。
答案 0 :(得分:1)
只需将纸张标签添加到core-scroll-header-panel即可。
以下是代码段
<core-scroll-header-panel id="core_scroll_header_panel">
<core-toolbar id="core_toolbar" class="tall">
<div id="div" flex>
<paper-tabs selected="1" selectedindex="1" horizontal center layout>
<paper-tab id="paper_tab" flex horizontal layout>Home</paper-tab>
<paper-tab id="paper_tab1" flex horizontal layout active>Phone</paper-tab>
<paper-tab id="paper_tab2" flex horizontal layout>Activities</paper-tab>
</paper-tabs>
</div>
</core-toolbar>
<section id="section" content></section>
</core-scroll-header-panel>
我也有涟漪效应,因为它们是纸质元素。