/ / Polimero: esegue la transizione delle pagine animate sull'elemento polimerico - polimero

Polimero: eseguire la transizione delle pagine animate sull'elemento polimerico - polimero

Di 'ho una app per polimeri test-app, un div regolare div-ae un elemento polimerico page-a.

Ora sto cercando di costruire un animated-pages, che contiene div-a e 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>

Il problema è: durante l'esecuzione della transizione, l'animazione è attiva div-a funziona bene, ma quello su page-a non funziona. Invece di svanire, il page-a appare all'improvviso.

Un altro punto strano è: se cambio transitions="cross-fade" in transitions="cross-fade-all"e rimuovi altri cross-fade definito su div e page-a, entrambe le transizioni funzionano.

Qualche idea?

risposte:

0 per risposta № 1

La dissolvenza incrociata non funziona direttamente sugli elementi che hanno overflow: hidden impostato.


domande correlate


Commenti (0)

Aggiungi un commento