Flash incorporato nella fisarmonica asp.net funziona male

Question

Sto usando l'estensione della fisarmonica ajax toolkit e noto che esegue un po 'di "funky" quando provo a incorporare un po 'di flash nelle sezioni del contenuto.

Puoi vedere cosa sto lavorando ora su: http://kristinsconfections.com/gallery.aspx. Come puoi vedere quando attivi la fisarmonica è un po 'instabile. Sto estraendo la presentazione flash da Flickr, quindi non posso controllarlo affatto. Il sito è solo per un amico che sta cercando di diventare un fornaio, quindi non ha la massima priorità, ma è estremamente frustrante !! Tutto ciò che posso fare usando javascript, .net o persino jquery ??

Ecco il codice esatto che sto usando in quella pagina:

<cc1:Accordion ID="MyAccordion" runat="server" SelectedIndex="0"
        HeaderCssClass="accordionHeader" ContentCssClass="accordionContent"
        FadeTransitions="true" FramesPerSecond="40" TransitionDuration="250" AutoSize="None">
        <Panes>
            <cc1:AccordionPane ID="pnlCakes" runat="server">
                <Header><div ><span style="float:left;">Cakes</span></div></Header>
                <Content>
                    <object width="572" height="429" type="application/x-shockwave-flash"
                     data="http://www.flickr.com/apps/slideshow/show.swf?v=67089"> 
                    <param name="flashvars" value="&offsite=true&amp;lang=en-us&page_show_url=%2Fphotos%2F28792515%40N08%2Fsets%2F72157612640424865%2Fshow%2F&page_show_back_url=%2Fphotos%2F28792515%40N08%2Fsets%2F72157612640424865%2F&set_id=72157612640424865&jump_to=" />
                    <param name="allowFullScreen" value="true" />
                    <param name="movie" value="http://www.flickr.com/apps/slideshow/show.swf?v=67089" />
                    </object>
                </Content>
            </cc1:AccordionPane>
             <cc1:AccordionPane ID="pnlCookies" runat="server">
                <Header><div ><span style="float:left;">Cookies</span></div></Header>
                <Content>
                 <object width="572" height="429"  type="application/x-shockwave-flash"
                 data="http://www.flickr.com/apps/slideshow/show.swf?v=67089"> 
                <param name="flashvars" value="&offsite=true&amp;lang=en-us&page_show_url=%2Fphotos%2F28792515%40N08%2Fsets%2F72157612640405779%2Fshow%2F&page_show_back_url=%2Fphotos%2F28792515%40N08%2Fsets%2F72157612640405779%2F&set_id=72157612640405779&jump_to=" />
                <param name="allowFullScreen" value="true" />
                <param name="movie" value="http://www.flickr.com/apps/slideshow/show.swf?v=67089" />
                </object>
                </Content>
            </cc1:AccordionPane>
            <cc1:AccordionPane ID="pnlCupcakes" runat="server">
                <Header><div ><span style="float:left;">Cupcakes</span></div></Header>
                <Content>
                <object width="572" height="429"  type="application/x-shockwave-flash"
                 data="http://www.flickr.com/apps/slideshow/show.swf?v=67089"> 
                <param name="flashvars" value="&offsite=true&amp;lang=en-us&page_show_url=%2Fphotos%2F28792515%40N08%2Fsets%2F72157612589253131%2Fshow%2F&page_show_back_url=%2Fphotos%2F28792515%40N08%2Fsets%2F72157612589253131%2F&set_id=72157612589253131&jump_to=" />
                <param name="allowFullScreen" value="true" />
                <param name="movie" value="http://www.flickr.com/apps/slideshow/show.swf?v=67089" />
                </object>
                </Content>
            </cc1:AccordionPane>
        </Panes>
</cc1:Accordion>

Answer 1

Trovo le cose del toolkit Ajax troppo goffe in generale. JQuery è così facile da usare, ha un buon supporto cross-browser ed estensibilità che lo utilizziamo preferibilmente e ti consiglierei di fare lo stesso. Esiste un widget di accordian nella suite dell'interfaccia utente di JQuery che dovrebbe adattarsi al conto.

Se avere tutti i filmati Flash caricati nei div nascosti ti dà scarse prestazioni, c'è un evento a cui puoi agganciarti in caso di modifica in cui potresti caricare in Flash. Questo è documentato sulla pagina della fisarmonica (e può essere facilmente eseguito con JQuery).

Answer 2

Sembra essere un bug di lunga durata in Firefox non specifico per Firefox qualsiasi widget particolare. I miei migliori tentativi:

<script type="text/javascript">
    function pageLoad() {
        var acc = $find('<%= MyAccordion.ClientID %>_AccordionExtender');
        acc.add_selectedIndexChanged(MyAccordion_SelectedIndexChanged);
    }
    function MyAccordion_SelectedIndexChanged(sender) {
        $("object").css("visibility", "hidden");
        setTimeout(
            function() { 
                $("object").eq(sender.get_SelectedIndex()).css("visibility", "visible"); 
            }, 1000);
    }
</script>

1. Nascondi la visibilità dell'oggetto in modo che le animazioni della fisarmonica vengano riprodotte
2. Aspetta 1 secondo - si spera abbastanza a lungo per il completamento delle animazioni, ma non troppo a lungo in modo che ci sia un notevole ritardo
3. Mostra l'oggetto nascosto

Questo risolve lo sfarfallio, ma l'oggetto flash scompare mentre le animazioni vengono riprodotte

Answer 3

L'ho testato con FireFox3, IE8 e Chrome, e in realtà sembra funzionare bene in IE (versione 8), e non così carino in FF3 e Chrome.

Ho trovato questo post da qualche parte che ha riscontrato lo stesso problema e sembra che l'impostazione della proprietà FadeTransitions su "False" lo risolva, anche se scommetto che non è la soluzione che speravi.

Answer 4

Per il momento hai provato a mettere un'immagine di anteprima nella fisarmonica? Quindi quando l'utente fa clic sull'immagine usando JavaScript per sostituirlo con il flash? Penso che sarebbe molto meglio.

Quando qualcuno seleziona un riquadro diverso nella fisarmonica (non sono sicuro dell'evento da monitorare - guarda in AccordionBehavior.js), puoi rimuovere il flash, sostituirlo con un'immagine e procedere.

Penso che non dovresti preoccuparti dell'interazione flash / browser che ti sta causando problemi.

Answer 5

Consiglio di utilizzare anche il widget di fisarmonica jQuery . Ci ho lavorato ed è molto facile da usare, leggero, funziona su tutti i browser e non ho trovato alcun bug. Ci sono molte pelli che puoi scegliere e, se la spinta arriva a spingere, non è davvero un gran dolore nel culo costruire la tua pelle.

Inoltre, dai un'occhiata al modo in cui stai incorporando i tuoi file SWF, in particolare l'attributo wmode . C'è un buon articolo esplicativo scritto qui , potresti iniziare con quello. Puoi ignorare le modalità GPU e direct , perché penso che non stai usando un SWF compilato per Flash Player 10.

E, naturalmente, dovresti scaricare i filmati flash che non sono visibili.