JQuery-Implementierung von Facebooks Modal Box

Question

Ich frage mich, ob jemand von einer jQuery-Implementierung von this MooTools modal box wusste. Ich habe Facebox gesehen, aber es sieht aus wie das alte modale Dialoglayout von Facebook und nicht das neuere.

Wenn es keine verfügbaren gibt, dann wäre ein Beispiel dafür, wie man den Dialog von jQuery mit ui modal aussehen könnte, sehr hilfreich. Die HTML-Ausgabe für die jQuery UI Modal Dialog sieht wie folgt aus:

<div class="ui-dialog ui-widget ui-widget-content ui-corner-all ui-draggable ui-resizable"> 
    <div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix"> 
     <span id="ui-dialog-title-dialog" class="ui-dialog-title">Dialog title</span> 
     <a class="ui-dialog-titlebar-close ui-corner-all" href="#"><span class="ui-icon ui-icon-closethick">close</span></a> 
    </div> 
    <div style="height: 200px; min-height: 109px; width: auto;" class="ui-dialog-content ui-widget-content" id="dialog"> 
     <p>Content.</p> 
    </div> 
</div> 

Answer 1

Wie wäre es LightBox?

http://leandrovieira.com/projects/jquery/lightbox/

Answer 2

Check out jQueryUI der Dialog Class. Sie können das CSS so hacken, dass es wie das von Facebook aussieht.

Siehe http://www.jqueryui.com/demos/dialog/#modal-form.

Answer 3

Wie wäre es mit dem jQuery-Plugin Facebox?

Es kommt direkt aus der Box tun so ziemlich alles, was Sie brauchen. Ändern Sie einfach die Bild-Ressource, auf die im CSS verwiesen wird, für die Schaltfläche Schließen auf eine, die Sie von Facebook kopieren, und die obere Bildunterschrift und die Fußzeilen-divs wie das Facebook-Dialogfeld. Die transluzenten grauen Ränder sind im Facebook-Plugin alle out of the box.

Answer 4

Warum nicht die Facebook Connect-Bibliothek verwenden?

FB.Connect.showShareDialog zeigt immer das richtige Layout für den modalen Dialog, den Facebook verwendet. Facebook aktualisiert dieses Ding die ganze Zeit, so dass es nicht viel Sinn macht, etwas zu verwenden, das schnell veraltet ist, besonders wenn niemand auf dem Laufenden ist. Ich benutze es trotzdem.

Answer 5

Dies ist wahrscheinlich das, was Sie suchen:

http://www.electrictoolbox.com/jquery-facebox-opaque-background/