/ / Polimērs: veic animācijas lapu pāreju uz polimēra elementu - polimēru

Polimērs: veiciet animācijas lapu pāreju uz polimēru elementu - polimēru

Sakiet, ka man ir viena polimēra lietotne test-app, viens regulārs div div-aun viens polimēra elements page-a.

Tagad es cenšos veidot a animated-pages, kas satur div-a un page-a

<link rel="import" href="../../bower_components/core-header-panel/core-header-panel.html">
<link rel="import" href="../../bower_components/core-icons/core-icons.html">
<link rel="import" href="../../bower_components/paper-icon-button/paper-icon-button.html">
<link rel="import" href="../../bower_components/core-animated-pages/core-animated-pages.html">

<link rel="import" href="../page-a/page-a.html">

<polymer-element name="test-app" flex vertical layout>

<template>
<core-animated-pages
selected="{{selected}}"
transitions="cross-fade"
>
<section name="div-a">
<div cross-fade>
<span>div-a</span>
</div>
</section>

<section name="page-a">
<page-a cross-fade></page-a>
</section>

</core-animated-pages>

</template>

<script src="./test-app.js"></script>

</polymer-element>

Problēma ir tā, ka, veicot pāreju, tiek aktivizēta animācija div-a darbojas labi, bet viens page-a nestrādā. Tā vietā, lai izbalētu, page-a vienkārši pēkšņi parādās.

Vēl viens dīvains punkts ir: ja es mainīšos transitions="cross-fade" uz transitions="cross-fade-all"un noņemiet citu cross-fade definēts div un page-a, abas pārejas darbojas.

Kāda ideja?

Atbildes:

0 atbildei Nr. 1

Cross-fade nedarbojas tieši uz elementiem, kuriem ir overflow: hidden iestatīt


Saistītie jautājumi


Komentāri (0)

Pievieno komentāru