gpt4 book ai didi

scroll - polymer 滚动问题

转载 作者:行者123 更新时间:2023-12-04 07:00:57 25 4
gpt4 key购买 nike

嗨,我只是在玩弄 polymer ,遇到了问题。

首先是我正在编辑的页面:http://beta.sgbvm.de/app/site/berichte.php

大多数事情都运行得很好(例如过渡等),但是当我向下滚动列表然后单击卡片时,站点会停留在底部,但我希望它向上滚动。

到目前为止,我搜索了将近 5 个小时,但我不知道如何在单击卡片后滚动回顶部。

我读了一些关于访问 shadowDom 的内容,但我没有理解他们在说什么。

<html>
<head>
<title>SG Bergedorf/VM - mobile Seite</title>

<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
<script src="../components/platform/platform.js"></script>
<link rel="import" href="../components/core-drawer-panel/core-drawer-panel.html">
<link rel="import" href="../components/core-header-panel/core-header-panel.html">
<link rel="import" href="../components/core-toolbar/core-toolbar.html">
<link rel="import" href="../components/core-icon-button/core-icon-button.html">
<link rel="import" href="../components/core-icon/core-icon.html">
<link rel="import" href="../components/core-menu/core-menu.html">
<link rel="import" href="../components/core-item/core-item.html">
<link rel="import" href="../components/paper-fab/paper-fab.html">
<link rel="import" href="../components/paper-icon-button/paper-icon-button.html">
<link rel="import" href="../components/paper-ripple/paper-ripple.html">
<link rel="import" href="../components/font-roboto/roboto.html">
<link rel="import" href="../components/core-animated-pages/core-animated-pages.html">
<link rel="import" href="../components/core-animated-pages/transitions/cross-fade.html">
<link rel="import" href="../components/core-animated-pages/transitions/slide-up.html">
<link rel="import" href="../components/core-animated-pages/transitions/hero-transition.html">
</head>
<body style="background-color:#F0F0F0;" unresolved touch-action="auto">
<core-drawer-panel>
<core-header-panel drawer style="background-color:#fff;">
<core-toolbar style="background-color:#3a3a3a;"><div class="bottom titleDrawer">SG B/VM</div></core-toolbar>
<core-menu class="drawer">
<div class="headline"><b>W&auml;hle:</b></div>
<core-item icon="mail" label="Nachrichten" onClick="self.location.href='index.php'"></core-item>
<core-item icon="content-paste" label="Spielberichte" onClick="self.location.href='berichte.php'"></core-item>
</core-menu>

</core-header-panel>

<core-header-panel id="mainContainer" mode="waterfall-tall" main>
<core-toolbar class="tall animate">
<core-icon-button icon="menu" class="buttonDrawer" onclick="document.querySelector('core-drawer-panel').togglePanel();"></core-icon-button>
<div flex></div>
<div class="bottom indent title">Berichte</div>
</core-toolbar>
<core-animated-pages class="content" style="background-color:#F0F0F0;" transitions="hero-transition cross-fade slide-up">
<section id="page1" style="background-color:#F0F0F0;" cross-fade horizontal layout wrap>
/** Left out a bit here **/
</section>

<section id="page2" style="background-color:#F0F0F0;">


<div id="ergebnisBig" style="width:100%" cross-fade>
<table cellpadding='0' border='0' cellspacing='0' style='width:100%; background-color:#3a3a3a;' id="placeholderTable" hero>
<tr style="width:100%;">
<td style="width:40px;">
&nbsp;&nbsp;<paper-fab icon="arrow-back" role="button" class="mini" onclick='changeBack();' slide-up></paper-fab>
</td>
<td class='ergebnisBig' id='placeholderErgebnis'>
&nbsp;
</td>
<td style="width:40px;">
<a name="top" id="top">&nbsp;</a>
</td>
</tr>
<tr>
<td id="placeholderHalbzeit" class='halbzeitBig' colspan="3"></td>
</tr>
<tr>
<td id="placeholderTeams" class='teamsBig' colspan="3"></td>
</tr>
</table>
</div>
<div style="width:100%;" horizontal center-justified layout>
<div id="placeholderText" class="card" style="width:93%;padding:10px;" slide-up>

</div>
</div>

</section>


</core-animated-pages>
</core-header-panel>
</core-drawer-panel>
</body>
</html>

最佳答案

core-header-panel提供 scroller property这使您可以访问内部滚动 div .从那里,您可以使用 vanilla JS 滚动它(使用 scrollTop )。

document.querySelector('#mainContainer').scroller.scrollTop = 0;

关于scroll - polymer 滚动问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25146834/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com