在一個div中心的div div

我需要像圖片一樣實現，除了加載器部分外，我已經完成了所有的工作。當我點擊左邊的複選框時，我想要div(loade+text "updating results)來到搜索結果div的中心。在一個div中心的div div

注：

即使滾動條是存在的，還是div(loade+text "updating results)在中心來了。
div(loade+text "updating results)未進入頁面中心，而是進入搜索結果中心（不包括左邊的複選框）。

請幫助，使這個在裝載機的搜索結果中心

**我附上需要的圖像，我還沒有實現它。

I need to implements

來源

2012-08-09 Maths Gal

請告訴我們你試過到目前爲止 – 2012-08-09 07:07:54

顯示了什麼了你的代碼請。但是，要做到這一點，您需要使用jQuery'Load（）'函數。而且，需要爲您的搜索結果區域創建容器包裝。因此，無論何時您製作任何複選框，它都會向您的'APi，WebService'發出'$ .ajax'請求並在那裏生成html。然後，通過'$（'myContainerResults'）加載這個html到你的容器。load（'/ data/results.php'）;'等等。 – 2012-08-09 07:13:50

你確定你知道你想要什麼？

我想DIV（loade +文字「更新結果）來在搜索中心結果

在頁面的中心不來的，而未來的搜索中心 resuls

我假設你想在屏幕中心顯示「更新結果」div

你需要將它的位置設置爲固定以使其不在文檔流中，然後設置位置從頂部和左側到50％，最後將邊距調整爲元素大小的一半，以考慮元素。

#updating_results_divs_id { 
    position: fixed; 
    height: 200px; 
    width: 400px; 
    top: 50%; 
    left: 50%; 
    margin-top: -100px; 
    margin-left: -200px; 
}

來源

2012-08-09 07:10:31 adeneo

**我附加的圖像是所需的，我沒有實現它。 – 2012-08-09 07:16:27

我覺得裝載div應定位absolute，而如果你把它嵌在搜索結果div內，嘗試添加這種風格：

{ 
    left: 50%; 
    top:50% 
}

來源

2012-08-09 07:20:43

但它將如何處理，當滾動條 – 2012-08-09 10:26:25

您可以TRU的jQuery BlockUI插件。 Here是一些演示。你也可以通過那裏使用的CSS。

此外，您還可以看看Dead Center

來源

2012-08-09 07:21:39

我知道這個插件。通過使用這整個頁面的將變得不可點擊而非div。我知道如何解決這個問題，但不知道如何集中對齊它。 – 2012-08-09 10:23:33

leftPos = $('.searchResultsDiv').offset().left +($('.searchResultsDiv').width() - $('.layerDiv').width())/2; 
    topPos = $('.searchResultsDiv').offset().top + ($(window).height()-$('.layerDiv').height())/5; 
    $('.layerDiv') 
     .css('position','fixed') 
     .css('left',leftPos) 
     .css('top',topPos);

來源

2012-08-09 17:33:34 chicharito

我想這可能會幫助別人的未來：

function setToCenterOfParent(obj, parentObj) { 
    var height = $(obj).height(); 
    var width = $(obj).width(); 
    if (parentObj == window) { 
     $(obj).css('top', ($(parentObj).height()/2) - (height/2)); 
     $(obj).css('left', ($(parentObj).width()/2) - (width/2)); 
    } 
    else { 
     $(obj).css('top', ($(parentObj).height()/2) - (height/2) + $(parentObj).position().top); 
     $(obj).css('left', ($(parentObj).width()/2) - (width/2) + $(parentObj).position().left); 
    } 
}

來源

2012-11-26 09:53:19

在一個div中心的div div

回答

相關問題