重新定位一個div

我試圖重新定位一個div - 可擴展面板的標題「何必」，所以纔出現，你現在看到它在顯示屏（底部）。但在HTML中，我希望它出現在8個面板的頂部。重新定位一個div

（這些面板都位於內容區的右側，而我這樣做是爲了保留當前網站的搜索引擎優化，這是我爲此構建的人賺取99％的錢）。

http://dev.assessmentday.co.uk/index.htm

我已經使用底部嘗試：0;但這不適用於可擴展面板。有沒有辦法使用CSS或JS做到這一點？

來源

2012-08-29 user1590819

你想顯示「何苦」 DIV頂部？ – Sowmya

您需要將它移到HTML的頂部，然後使用javascript重新定位它。用CSS就不可能。 – Jeemusu

，那麼你將不得不將其移到HTML代碼的頂部。 DOM的負載（帶有JS或CSS）後移動它會對它的SEO沒有影響，因爲SEO蜘蛛將讀取DOM它出現在原始的HTML的方式。

一旦它移動到頂部，然後你可以將它移動到使用JavaScript的底部，因此，它似乎是在底部。

假設它在<div class="contentLeft"與類dropdownPanel第一div元素，你可以使用下面的jQuery：

$(document).ready(function(){ 
    $('div.dropdownPanel:first').appendTo('#content div.contentLeft'); 
});

這裏是一個工作示例：

http://jsbin.com/ezizix/1/edit

我注意到你的網站，你有$快捷jQuery的殘疾，所以一定要與jQuery來替代它：

jQuery('div.dropdownPanel:first').appendTo('#content div.contentLeft');

來源

2012-08-29 09:56:34 Jeemusu

真棒，但仍然有最後一個下拉麪板相同的問題。我已經按照上述鏈接上傳了所做的更改。除了「爲什麼麻煩」下拉式功能無法正常工作以外，它完全是完美的。我怎樣才能讓面板掉下來，而不是起來？謝謝！ – user1590819

您是否回覆了錯誤的答案？我現在在看你的網站，你似乎有使用CSS絕對定位的元素，這解釋了爲什麼它不工作。 – Jeemusu

OK，看着你的網站，看來你已經實現了我的答案和晝夜的回答都在一起。這意味着你同時使用jQuery和CSS來移動它。因此它不起作用。如果你使用CSS，你會遇到向上擴展菜單的問題。禁用CSS。此外，請確保您使用啓動'jQuery（'div'的代碼，因爲您的網站未設置爲接受使用'$'調用jQuery。 – Jeemusu

你可以達到你想要絕對定位是什麼。我不知道這些下拉菜單在這之後是否會起作用，但值得一試。

這個如果你希望它出現在頂部的搜索引擎優化的原因添加到現有的contentLeft CSS規則

.contentLeft { 
    padding-bottom: 90px; 
    position: relative; 
}

一下添加到「特殊」的div

.specialdropdownPanel { 
    bottom: 20px; 
    position: absolute; 
}

來源

2012-08-29 09:54:26

這將移動它，但據我所知可擴展行爲將無法正常工作。 – Jeemusu

使用jQuery之前做到這一點Example on fiddle

$(".contentLeft .dropdownPanel").eq(0).before($(".contentLeft .dropdownPanel").eq(7));

來源

2012-08-29 10:10:48 Champ

重新定位一個div

回答

相關問題