Flash incrustado en asp.net accordian funciona mal

StackOverflow https://stackoverflow.com/questions/637179

  •  10-07-2019
  •  | 
  •  

Pregunta

Estoy usando el extensor de acordeón ajax toolkit y noto que funciona un poco "funky" cuando intento incrustar algo de flash en las secciones de contenido.

Puede ver lo que tengo trabajando ahora en: http://kristinsconfections.com/gallery.aspx. Como puede ver cuando activa el acordeón, es un poco entrecortado. Estoy sacando la presentación de diapositivas flash de flickr, así que no puedo controlar eso en absoluto. ¡El sitio es solo para un amigo que está tratando de convertirse en panadero, por lo que no es de alta prioridad, sino muy frustrante! ¿Algo que pueda hacer usando javascript, .net o incluso jquery?

Aquí está el código exacto que estoy usando en esa página: 

<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>
¿Fue útil?

Solución

Encuentro el material del kit de herramientas Ajax demasiado torpe en general. JQuery es tan fácil de usar, tiene un buen soporte y extensibilidad para varios navegadores que lo usamos con preferencia, y le recomendaría que haga lo mismo. Hay un widget acordeón en el conjunto de aplicaciones de interfaz de usuario de JQuery que debería ajustarse a la factura.

Si tener todas las películas Flash cargadas en los divs ocultos le da un bajo rendimiento, hay un evento en el que puede engancharse en el cambio donde podría cargar en Flash. Esto está documentado en la página acordeón (y se puede hacer fácilmente con JQuery).

Otros consejos

Parece ser un error en firefox no específico de Firefox. cualquier widget en particular Mis mejores intentos: 

<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. Ocultar la visibilidad del objeto para que se reproduzcan las animaciones de acordeón
  2. Espere 1 segundo, es de esperar el tiempo suficiente para que finalicen las animaciones, pero no demasiado para que haya un retraso notable
  3. Mostrar el objeto oculto

Esto corrige el parpadeo, pero el objeto flash desaparecerá mientras se reproducen las animaciones

Lo probé con FireFox3, IE8 y Chrome, y en realidad parece funcionar bien en IE (versión 8), y no tan bueno en FF3 y Chrome.

Encontré esta publicación de algún lugar que se encontró con el mismo problema, y ??parece que la configuración de la propiedad FadeTransitions a 'False' lo soluciona, aunque apuesto a que no es la solución que esperabas.

¿Has intentado poner una imagen de vista previa en el acordeón por el momento? ¿Entonces cuando el usuario hace clic en la imagen usando javascript para reemplazarla con el flash? Creo que se vería mucho mejor.

Cuando alguien selecciona un panel diferente en el acordeón (no estoy seguro del evento para monitorear, mire en AccordionBehavior.js), entonces puede eliminar el flash, reemplazarlo con una imagen y continuar.

Creo que no debería preocuparse por la interacción flash / navegador que le está causando problemas.

Recomendaría usar el jQuery accordion widget , también. He trabajado con él y es muy fácil de usar, liviano, funciona en todos los navegadores y no he encontrado ningún tipo de error. Hay muchas máscaras para las que puede elegir y, si se trata de empujar, en realidad no es demasiado doloroso construir su propia piel.

Además de eso, eche un vistazo a la forma en que está incrustando sus SWF, especialmente el atributo wmode . Hay un buen artículo explicativo escrito aquí , Podrías comenzar con eso. Puede ignorar los modos GPU y direct , porque creo que no está utilizando un SWF compilado para Flash Player 10.

Y, por supuesto, debe descargar las películas flash que no son visibles.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top