Comment faire pour arrêter le contenu Flash shine-through Interface jQuery UI dans Firefox sur Windows

Question

J'utilise la boîte de dialogue jQuery UI, dans IE & FF sur Windows Je reçois le contenu Flash sous-jacente brillant à travers la boîte de dialogue.

J'ai résolu cela sur IE en activant l'option bgiframe dans la fenêtre de dialogue jQuery et en changeant le script bgiframe pour l'appliquer à n'importe quel navigateur Windows, mais je reçois toujours le shine-through sur FF. Notez que je ne peux pas savoir exactement où le contenu Flash sera affiché car ce sont généralement des widgets Flash que les utilisateurs ont ajoutés aux pages, même si j'ai pensé à masquer le contenu Flash temporairement pendant l'affichage de la boîte de dialogue - est-ce la seule option qui me reste? Utilisez soit iFrame dans la boîte de dialogue, soit masquer le contenu du flash à la page lorsque la boîte de dialogue est déclenchée.

Answer 1

Essayez le paramètre wmode=transparent ou wmode=opaque.

Answer 2

Answer 3

J'avais rencontré un problème similaire une fois. Je me cache simplement le flash et le montrer à nouveau quand dialogue est rejeté:

<script type="text/javascript"> 
    /*notification dialog setup*/ 
     function SetupDialog() 
     { 
      $("div#divNotice").dialog(
       { autoOpen: false, 
        modal: true, 
        overlay: { opacity: 0.5, background: '#050505' }, 
        buttons: { 
           "I Agree": function(){ 
              $("#Movie").css("display","inline")//Show movie when dialog is closed 
              ....... 
             }, 
           "Close" : function(){ 
              $("#Movie").css("display","inline") //Show Movie if dialog is closed 
              $(this).dialog("close"); 
             } 
          }, 
        title: "", 
        height: 500, 
        width: 600, 
        dialogClass: 'myDialog', 
        position: 'center' 
       } 
      ); 
     } 
    </script> 
    <script type="text/javascript"> 
    function ShowDialog() 
    { 
     /*for Notice dialog */ 
     $("#divDialog").css("display","block"); 
     $("#Movie").css("display","none"); 
     $("div#divDialog").dialog("open"); 
    } 

Answer 4

<object ...> 
    ... 
    <param name="wmode" value="opaque" /> 
    ... 
    <embed ... wmode="opaque" ...></embed> 
</object> 

Answer 5

la boîte de dialogue jquery ui utilise un fichier css appelé jquery-ui-xxcss où xx indique la version

dans ce fichier, vous pouvez donner le débordement de la classe de dialogue .ui: auto; cela résoudra le problème

Answer 6

Veuillez noter que changer le mode d'animation de votre animation Flash augmentera sérieusement la charge CPU de votre machine et ralentira vos animations. Le lecteur Flash utilise sa propre fenêtre en haut de la fenêtre du navigateur pour une bonne raison. Avec wmode défini sur opaque Flash est forcé de rendre dans la fenêtre du navigateur. Avec wmode = transparent, il doit même fusionner ses rendus avec le contenu de l'étape du navigateur.

J'utilise généralement la même technique qui est également utilisée par de nombreux scripts de lightbox: allumer tous les films Flash invisibles tant que la boîte de dialogue est visible. Cela ne devrait PAS être fait en réglant display: none. Le résultat pourrait être décalé dans le reste de la page si le rectangle Flash n'est plus sur scène. Pour la même raison, vous ne devez PAS utiliser la méthode jQueries hide(). Au lieu de cela, utilisez la visibilité: caché qui occupe toujours l'espace de l'élément caché.

Voici ma façon de le faire:

$('#myDialogId').dialog({ 
    open: function(){ 
     // hide any flash objects 
     $('object').css('visibility', 'hidden'); 
     // hide any flash embeds 
     $('embed').css('visibility', 'hidden'); 
    }, 
    close: function(){ 
     // show any flash objects 
     $('object').css('visibility', 'visible'); 
     // show any flash embeds 
     $('embed').css('visibility', 'visible'); 
     // 
    } 
});