我的页面与https://www.polymer-project.org/components/core-scroll-header-panel/demo.html非常相似。唯一的区别是我的页面设置了keepCondensedHeader标志。
我现在想做什么（如果可能的话）： 如果标题是精简的，则隐藏标题（或精简标题中显示的任何一个元素）。
任何指针都会非常感激。
答案 0 :(得分：3)
实际上，演示文件中的javascript非常好地暗示了这样的事情是如何轻松完成的。
我将整个html和js复制到另外两行，当标题被压缩时隐藏标题。
我将 128 m作为翻译Y 的原因是因为最大标题高度为 {{1 } {/ s> 192，压缩高度为 d.height 64。当标题被压缩时，它在y轴上移动 d.condensedHeight 128（ m 192 - 64的距离）。
d.height - d.condensedHeight希望这有帮助！
<强>更新
实际上现在我认为，为<body unresolved>
<core-scroll-header-panel condenses keepcondensedheader>
<core-toolbar class="tall">
<core-icon-button icon="arrow-back"></core-icon-button>
<div flex></div>
<core-icon-button icon="search"></core-icon-button>
<core-icon-button icon="more-vert"></core-icon-button>
<div class="bottom indent title">Title</div>
</core-toolbar>
<div class="content">
<sample-content size="100"></sample-content>
</div>
</core-scroll-header-panel>
<script>
// custom transformation: scale header's title
var titleStyle = document.querySelector('.title').style;
// added code - here we need to obtain the title div as well
var title = document.querySelector('.title');
addEventListener('core-header-transform', function (e) {
var d = e.detail;
var m = d.height - d.condensedHeight;
var scale = Math.max(0.75, (m - d.y) / (m / 0.25) + 0.75);
titleStyle.transform = titleStyle.webkitTransform =
'scale(' + scale + ') translateZ(0)';
// added code - here we hide the title when the header is condensed
title.hidden = d.y == m;
});
</script>
</body>
的{{1}}制作动画可能更好，而不是显示/隐藏它。它会提供更好的用户体验以及opacity平滑滚动和淡化背景！
感谢title，它很直接。
首先，我们需要包含此参考。
core-scroll-header-panel然后淡出的定义＆amp;动画。
core-animation最后，我们在<link rel="import" href="../core-animation/core-animation.html">
处理程序中调用它们。
<body unresolved>
<!--define the opacity animations-->
<core-animation id="out" fill="forwards" duration="400">
<core-animation-keyframe>
<core-animation-prop name="opacity" value="1"></core-animation-prop>
</core-animation-keyframe>
<core-animation-keyframe>
<core-animation-prop name="opacity" value="0"></core-animation-prop>
</core-animation-keyframe>
</core-animation>
<core-animation id="in" fill="forwards" duration="400">
<core-animation-keyframe>
<core-animation-prop name="opacity" value="0"></core-animation-prop>
</core-animation-keyframe>
<core-animation-keyframe>
<core-animation-prop name="opacity" value="1"></core-animation-prop>
</core-animation-keyframe>
</core-animation>