使彈出窗口爲中心

我彈出一個窗口進行Facebook身份驗證，我希望該頁面的內容以彈出窗口爲中心。我是不是詢問如何將彈出窗口居中在屏幕上。我在問如何將頁面居中在彈出窗口中。 Javascript是好的。使彈出窗口爲中心

<a href="/auth/facebook" id="facebook_button" data-width="800" data-height="400"> 

<script> 
$("#facebook_button").click(ask_for_facebook_auth); 

function popupCenter(url, width, height, name) { 
    var left = (screen.width/2)-(width/2); 
    var top = (screen.height/2)-(height/2); 
    return window.open(url, name, "menubar=no,toolbar=no,status=no,width="+width+",height="+height+",toolbar=no,left="+left+",top="+top); 
} 

function ask_for_facebook_auth(e){ 
    popupCenter($(this).attr("href"), $(this).attr("data-width"), $(this).attr("data-height"), "authPopup"); 
    e.stopPropagation(); return false; 
} 
</script>

來源

2012-02-07 stackOverlord

如何分享彈出窗口中涉及的某些標記，以便我們不必猜測您擁有什麼。 – Gabe 2012-02-07 02:21:44

有時候人們只是懶惰。好的問題需要好的答案... – elclanrs 2012-02-07 02:26:58

對不起，我添加了它。 – stackOverlord 2012-02-07 02:34:26

這並不是彈出中心的通用解決方案，但它解決了我的問題與facbeook AUTH對話。你必須把

config.omniauth :facebook, APP_ID, APP_SECRET, { :display => 'popup' }

在初始化/ omniauth使Facebook將產生一個居中頁面看起來不錯的彈出窗口。

來源

2012-02-07 22:19:10 stackOverlord

你想使用window.scrollTo()方法一半的體寬/高分別減去一半的窗口innerWidth/innerHeight居中視口。這應該可以完成你所追求的內容：

window.onload = function() { 
    var w = window.innerWidth * 0.5; 
    var h = window.innerHeight * 0.5; 
    var x = document.body.clientWidth * 0.5 - w; 
    var y = document.body.clientHeight * 0.5 - h; 
    window.scrollTo(x,y); 
}

來源

2012-02-07 02:28:24 Aaron

有什麼辦法從父窗口調用它？我不確定如何在子窗口上運行JavaScript，因爲它是Facebook的應用程序權限頁面。 – stackOverlord 2012-02-07 02:45:24

不幸的是，如果您沒有編輯訪問不同域上的子頁面的權限，您將無法確定子項的寬度/高度，因此無法將父窗口居中內容。但是，Facebook可能支持某些查詢字符串變量，這些變量定義從外部域加載的頁面的寬度和高度，在這種情況下，您可以使用popupName.scrollTo（）來滾動彈出窗口，給定您定義的寬度/高度。 – Aaron 2012-02-07 02:58:04

嗯我試過w = window.open（...）; w.scrollTo（300,10），但它似乎沒有任何作用。 – stackOverlord 2012-02-07 03:23:20

使用此功能來居中彈出。

jQuery.fn.center = function() { 
      this.css("position","absolute"); 
      this.css("top", (($(window).height() - this.outerHeight())/2) + $(window).scrollTop() + "px"); 
      this.css("left", (($(window).width() - this.outerWidth())/2) + $(window).scrollLeft() + "px"); 
      return this; 
     }

如果你想中心，ID simplemodal容器 DIV然後用

$('#simplemodal-container').center();

來源

2012-02-07 03:35:19

使彈出窗口爲中心

回答

相關問題