페이스 북 모달 박스의 JQuery 구현

Question

this MooTools modal box의 jQuery 구현을 아는 사람이 있는지 궁금합니다. Facebox를 보았지만 새로운 Facebook 모듈 모달 대화 상자 레이아웃과 비슷합니다.

사용할 수없는 경우 jQuery의 UI 모달 대화 상자를 테마 화하는 방법에 대한 예제가 도움이 될 것입니다. JQuery와 UI 모달 대화 상자의 HTML 출력은 다음과 같습니다

<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

어떻게 라이트 박스에 대해?

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

Answer 2

체크 아웃 JQueryUI의 대화 클래스입니다. CSS를 해킹하여 페이스 북처럼 보이게 할 수 있습니다.

http://www.jqueryui.com/demos/dialog/#modal-form을 참조하십시오.

Answer 3

jQuery 플러그인은 어떻습니까 Facebox?

당신이 필요로하는 거의 모든 것을하고있는 것은 바로 상자에서 나온 것입니다. Close 버튼의 CSS에서 참조한 이미지 리소스를 Facebook에서 복사 한 이미지 리소스로 변경하고 Facebook의 대화 상자처럼 스타일이 지정된 캡션 및 푸터 div를 캡쳐하십시오. 반투명 회색 테두리가 Facebook 플러그인의 모든 상자에 있습니다.

Answer 4

왜 Facebook Connect의 라이브러리를 사용하지 않습니까?

FB.Connect.showShareDialog은 Facebook이 사용하는 모달 대화 상자의 올바른 레이아웃을 항상 보여줍니다. 페이스 북은이 문제를 항상 업데이트하므로, 특히 아무도 최신 정보를 얻지 못한다면, 구식이 될만한 것을 사용하는 것은별로 의미가 없습니다. 그것은 내가 어쨌든 사용하는 것입니다.

Answer 5

이 당신이 찾고있는 아마 :

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