/ / / Polymer: πραγματοποιήστε μετάβαση σε κινούμενες σελίδες σε πολυμερές στοιχείο - πολυμερές

Πολυμερές: πραγματοποιήστε μετάβαση σε κινούμενες σελίδες σε πολυμερές στοιχείο - πολυμερές

Πέστε ότι έχω μια εφαρμογή πολυμερούς test-app, ένα κανονικό div div-a, και ένα πολυμερές στοιχείο page-a.

Τώρα προσπαθώ να χτίσω ένα animated-pages, που περιέχει div-a και 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>

Το πρόβλημα είναι: κατά την εκτέλεση της μετάβασης, ενεργοποιείται η κινούμενη εικόνα div-a λειτουργεί καλά, αλλά το ένα page-a δεν δουλεύει. Αντί να ξεθωριάσει, το page-a μόλις ξαφνικά εμφανίζεται.

Ένα άλλο παράξενο σημείο είναι: αν αλλάξω transitions="cross-fade" σε transitions="cross-fade-all", και να αφαιρέσετε άλλα cross-fade που ορίζεται στο div και page-a, και οι δύο μεταβάσεις λειτουργούν.

Καμια ιδεα?

Απαντήσεις:

0 για την απάντηση αριθ. 1

Το cross-fade δεν λειτουργεί απευθείας σε στοιχεία που έχουν overflow: hidden σειρά.


Σχετικές ερωτήσεις


Σχόλια (0)

Πρόσθεσε ένα σχόλιο