Problème avec le bouton Facebook Like dans Windows Firefox

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

Question

J'ai un facebook comme bouton (édition iFrame) qui est superposé au-dessus d'une application Flash de navigateur complet. Analogues bouton est relié à des images séparées comme dans l'application, lorsque chacune de nouvelles images est signalée, comme le bouton est actualisée avec des données en utilisant ExternalInterface.

analogues bouton fondus dans et hors de chaque nouvelle image en utilisant JQuery fadeIn () / fadeOut (), encore une fois être appelé avec ExternalInterface.

La question que je vais avoir est que sur Windows, cela ne semble pas vouloir travailler, dans Firefox spécifiquement ...

CSS: 

        html {
            height: 100%;
            overflow: hidden;
            min-width: 800px;
            min-height: 600px;
        }
        #flashContent {
            position: absolute;
            top: 0px;
            left: 0px;
            height: 100%;
            width: 100%;
            z-index: 1;
        }
        body {
            margin: 0;
            padding: 0;
            background-color: #000000;
        }
        #fb-like {
            position: absolute;
            bottom: 32px;
            left: 510px;
            width: 280px;
            z-index: 9999;
            display: none;
        }

fb-like est le div contenant l'iFrame, et il est z-index est 9999 juste pour vous assurer qu'il est toujours au-dessus.

Voici la JS utilisé: 

<script type="text/javascript">

    var isVisible = false;  

    function showLikeButton( visible ){         

        if( visible == true )
        {
            $('#fb-like').fadeIn( 'slow' );

            isVisible = true;

        }
        else if ( isVisible )
        {
            $('#fb-like').fadeOut( 'slow' );

            isVisible = false;

        }
    }

    var begOfUrl = "http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fmywebsite.com%2fdirectory";
    var endOfUrl = "&amp;layout=button_count&amp;show_faces=false&amp;width=150&amp;action=like&amp;colorscheme=dark&amp;height=21";

    function sendIdToLikeButton( title, id ){                   
        $( '#facebook-like' ).attr( 'src', begOfUrl + "%3Fid=" + id + endOfUrl );
    }

</script>

où la méthode sendIdToLikeButton prend l'ID de la photo envoyée par Flash à l'aide ExternalInterface pour recréer l'attribut src du iFrame.

Et bien sûr, car cela est une application flash, voici le code HTML minimal: 

<body>

<div id="fb-like">
        <iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fnfb.designaxiom.com/build13&amp;layout=button_count&amp;show_faces=false&amp;width=150&amp;action=like&amp;colorscheme=dark&amp;height=21" scrolling="no" frameborder="0" style="position: absolute; border:none; overflow:hidden; width:300px; height:40px;" allowTransparency="true" id="facebook-like"></iframe>
    </div>
    <div id="flashContent">
        <a href="http://www.adobe.com/go/getflashplayer">
            <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
        </a>
    </div>
</body>

Encore une fois, cela fonctionne partout sauf pour Firefox sous Windows, et je ne suis pas sûr de ce qu'il faut faire à ce sujet. Je suppose qu'il est une erreur dans le CSS ou Javascript quelque part.

Toute aide est grandement appréciée.

Merci à l'avance.

Grammaire

Était-ce utile?

La solution

J'ai finalement compris cela après deux semaines de retour en arrière. En fin de compte la question était à l'iframe étant placé au-dessus du contenu flash.

Cela a été résolu en ajoutant un param à l'appel swfobject - wmode transparent réglage: 

        var params = {};
        params.bgcolor = "#000000";
        params.allowfullscreen = "true";
        params.allowscriptaccess = "true";
        params.wmode = "transparent";

        var attributes = { id: "nfb", name:"nfb" };
        var swfUrl = "Runner.swf";

        swfobject.embedSWF( swfUrl, "flashContent", "100%", "100%", "10.0.0", false, flashvars, params, attributes );

Réglage du wmode transparent autorisé pour l'iframe à placer « transparent » au-dessus de l'application dans tous les navigateurs.

Alors il se trouve que ce n'était pas un problème avec le facebook comme bouton du tout, mais avec iframes et Flash. Bien sûr, si vous ne l'utilisez SWFObject pour afficher vos fichiers swf, le wmode est un paramètre qui peut être défini dans les propriétés de publication dans Flash lorsque vous publiez vos fichiers SWF.

Vive

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top