как показать синий заголовок facebook на fbml.dialog. (как в stream.publish) - PullRequest
Новая
       14

как показать синий заголовок facebook на fbml.dialog. (как в stream.publish)

3 голосов
/ 24 июня 2011

В настоящее время я показываю fbml.dialog вот так: 

 FB.ui(
   {
     'method': 'fbml.dialog',
     'display': 'dialog',
     'fbml': "<h1>this is some fbml markup</h1>",
     'width': 575
   },
   function() {
     alert(true, 'callback was invoked');
   }
 );

Как отобразить заголовок Facebook синего цвета (с кнопкой закрытия) в этом диалоге?

1 Ответ

1 голос
/ 27 июля 2011

На самом деле это не ответ на ваш вопрос, но я тоже разочаровался попыткой рендеринга диалогов в Facebook, поэтому вместо этого я использовал JQuery UI и использовал следующие стили (предполагается, что идентификатор диалога равен 'dialog'). 

/* Facebook Dialogue Styles */
.ui-widget-overlay {background: none;}
.ui-dialog{background: rgba(82, 82, 82, 0.7);padding:10px;border-radius: 8px;-webkit-border-radius: 8px;}
.ui-dialog .ui-dialog-titlebar{background: #6D84B4;border: 1px solid #3B5998;font-family: "lucida grande",tahoma,verdana,arial,sans-serif;color: white;font-size: 14px;font-weight: bold;}
#dialogue{border-left: 1px solid #555;border-right: 1px solid #555;border-bottom: 1px solid #CCC;background-color:#FFF;padding:0px;overflow:hidden}
#dialogue p, #dialogue div{font-family: "lucida grande",tahoma,verdana,arial,sans-serif;font-size:13px;}
.ui-widget-content{background: none none 50% top repeat-x;border:none;}
.ui-dialog-titlebar-close{display:none}
.ui-dialog .ui-corner-all{-moz-border-radius: 0px;-webkit-border-radius: 0px;border-radius: 0px;}
.ui-dialog .ui-dialog-buttonpane{background: #F2F2F2; margin:0;border-left: 1px solid #555;border-right: 1px solid #555;border-bottom: 1px solid #555;padding:8px}
.ui-dialog .ui-dialog-buttonpane button{ margin:0;padding:2px 6px;}
.ui-state-default, .ui-widget-content .ui-state-default{border-color: #29447E;color: #FFF;background:#6D84B4;}
.ui-state-hover, .ui-widget-content .ui-state-hover{border-color: #29447E;background:#6D84B4;}
.ui-state-active, .ui-widget-content .ui-state-active{background: #4F6AA3;border-bottom-color: #29447E;box-shadow: 0 1px 0 rgba(0, 0, 0, .05); -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .05);}
.ui-button-text-only .ui-button-text {padding:0px}
.ui-dialog .ui-dialog-titlebar {padding: 5px;}

Надеюсь, это поможет.

...