مشكلة مع Facebook مثل الزر في Windows Firefox

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

سؤال

لقد حصلت على زر مثل Facebook Like (إصدار Iframe) الذي يتدفق فوق تطبيق فلاش متصفح كامل. يتم توصيل الزر الذي يعجبك إلى مثل الصور المنفصلة داخل التطبيق ، وعندما يتم عرض كل صور جديدة ، يتم تحديث الزر المعثل بالبيانات باستخدام واجهة خارجية.

يتلاشى الزر LIKE داخل وخارج كل صورة جديدة باستخدام jQuery fadein () / fadeout () ، مرة أخرى يتم استدعاؤها باستخدام واجهة خارجية.

المشكلة التي أواجهها هي أنه على Windows ، لا يبدو أن هذا يريد العمل ، في Firefox على وجه التحديد ...

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 هو DIV الذي يحتوي على iframe ، وهو Z-index هو 9999 فقط للتأكد من أنها موجودة دائمًا.

هنا هو استخدام JS:

<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>

حيث تأخذ طريقة SendIdToLikebutton معرّف الصورة المرسلة من Flash باستخدام Flash ExternalInterface لإعادة إنشاء سمة SRC من IFRAME.

وبالطبع ، نظرًا لأن هذا تطبيق فلاش ، إليك الحد الأدنى من HTML:

<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>

مرة أخرى ، يعمل هذا في كل مكان باستثناء Firefox في Windows ، ولست متأكدًا مما يجب فعله حيال ذلك. أفترض أنه خطأ في CSS أو JavaScript في مكان ما.

أي مساعدة يحظى بتقدير كبير.

شكرا مقدما.

قواعد

هل كانت مفيدة؟

المحلول

لقد اكتشفت أخيرًا هذا بعد بضعة أسابيع من ذهابًا وإيابًا. كما اتضح أن المشكلة كانت مع وضع iFrame فوق محتوى الفلاش.

تم حل هذا عن طريق إضافة param إلى SWFObject Call - إعداد WMode إلى شفاف:

        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 );

قم بتعيين WMode على شفاف السماح بتوضع IFRAME "شفاف" على أعلى التطبيق في كل متصفح.

لذلك كما اتضح ، لم تكن هذه مشكلة في زر مثل Facebook على الإطلاق ، ولكن مع iframes و flash. بالطبع إذا كنت لا تستخدم SWFObject لعرض ملفات SWF الخاصة بك ، فإن WMode هو معلمة يمكن تعيينها في خصائص النشر في Flash عند نشر SWFS.

هتافات

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top