Question

I have developed a word press plug-in that causes jQuery UI dialog show up when user click a link.

That dialog contains a facebook button. The button appears normally outside the dialog doesn’t show in the dialog.

When I load the page and hurry up to click a link before the page completes loading, the button shows up and works normally!!

I have used FB debugger and there are no warnings.

The jquery function:

    <script type="text/javascript">
    var timer;
    var isclose=<?php echo get_option('WPVS_close')?>;
    jQuery(document).ready(function() {

    //jQuery(function(){        
    //popup box jquery settings

    jQuery(".cdialog").dialog("modal");
    jQuery(".cdialog").dialog({                     
                    autoOpen: false,
                    modal:true,
                    title: "",
                    zIndex: 9998,
                    closeOnEscape: true,
                    resizable: false,
                    width: <?php echo get_option('WPVS_width');?>,
                    height: <?php echo get_option('WPVS_height');?>,
                    beforeClose: function(event, ui) { clearTimeout(timer);    clearInterval(timer); },
                    open: function(event, ui) {
                        delay=<?php echo get_option('WPVS_delay');?> ;
                        isclose=<?php echo get_option('WPVS_close'); ?>;
                        timer=setInterval( "delaytime()" , 1000);
                        jQuery(".ui-dialog-titlebar", ui.dialog).hide();
                        jQuery(".ui-dialog-titlebar-close", ui.dialog).show();
                        if (!isclose||urll==location.href){jQuery("#closebutton").hide();};
                    }

                    });
  jQuery(function() {
       jQuery( "#closebutton" ).button({
        icons: {
            primary: "ui-icon-close"
        },
        text: false
    });

    jQuery( "#closebutton" ).click(function(event)
    {
        jQuery(".cdialog").dialog("close");
    });

});
    });
       </script>

The div that contains the dialog:

<div  class="cdialog"  title="" >
<p>Please Share Our Page On Social Networks Or Wait  <b class="ctimer" ></b> seconds<b class="ctimernn" ></b> To Be Redirected</p>
<div><fb:like href="'.get_option('ste_like').'" send="false" width="450" show_faces="true"></fb:like></div>
<div><a href="https://twitter.com/share" class="twitter-share-button" data-lang="en" data-text="'.get_option('ste_tweet').'" data-url="'.get_option('ste_tweet_url').'">Tweet</a></div>
<g:plusone callback="plusdone" href="'.get_option('WPVS_gplus').'"></g:plusone>         
</div>

contains the installed plugin.

Answer 1

That was so sketchy…I was including the facebook functions into header. When I put it into body or footer it works fine and didn’t disappear anymore…
Thanks for all efforts,