頁面佈局略有變化，無風格變化

我正在重新設計my personal/development website，並試圖使其儘可能地方便用戶。頁面佈局略有變化，無風格變化

我想用AJAX加載新頁面並將其滑入，這就是當前正在發生的事情。一切工程在所有目前的瀏覽器（IE除外，但我將在未來的工作）。

但是，在我的導航菜單第一個（並且只有第一個）頁面更改中有一個奇怪的間距跳轉。頁面更改一次後，導航間距保持不變。點擊一個鏈接

在頁面加載
後當用戶點擊一個鏈接，在新的頁面導航部分將取代當前的導航，因爲每個環節具有由服務器後端計算的數據偏移量屬性，以便JavaScript知道在單擊它們時哪個方向以及滑動元素的距離。

目前我在做它的方式，它要麼[內容寬度]或- [內容寬度]。

但是，菜單結構從來沒有的變化，並且樣式表是完全靜態的。我已經檢查了Firebug中的所有這些元素，並且在頁面加載時沒有任何更改。

我連接上面的the site, http://next.randolphwebdevelopment.com，但我會複製一些相關的Javascript在這裏給出一個發生了什麼的想法。

拉整個頁面下的鏈接會重定向到（除非另有規定，今後所有的代碼塊也是這個回調中）：
```
$.get(loc, function(data){ 
    //delete the doctype declaration 
    data = data.split("\n").slice(1).join("\n"); 
    next_page = $(data.replace(/(\r\n|\n|\r)/gm,"").replace(/>\s*</gm,'><')); 
```
替換導航與目標的新的導航頁面（所有真正改變的是每條鏈路上的數據偏移屬性）：
```
//insert the new navigation 
$('#header-content nav').html(next_page.find('#header-content nav').html()); 
$('#header-content nav a').click(navigation_clickHandler); 
```
就是這樣。有很多代碼可以插入新內容並將其滑入，還可以更改頁面標題，設置歷史記錄狀態等，但這是觸摸導航菜單的唯一代碼，並且沒有代碼可以觸及任何樣式表。

我接受任何解決問題和/或改進代碼設計的建議。

來源

2012-04-06 rockerest

它看起來像你的導航的寬度正在改變：先是367px，然後是355px ... – 2012-04-06 04:41:58

@RobertSmith是的，但沒有寬度分配給導航，它只是延伸到裏面的任何東西，所以它是一個尺寸改變，這個問題，但我沒有看到變化，或者這種變化將來自何處。 – rockerest 2012-04-06 04:48:25

起初加載nav是從服務器w/o php獲得。我敢打賭，你用intendation手動編寫了這個html，等等。

任何點擊js後重新創建nav，但現在沒有空文本節點。只需<a>link1</a><a>link2</a>。

添加空格或從源html中刪除它們。

來源

2012-04-06 05:18:24 kirilloid

實際上，'nav'總是通過PHP運行，首先通過無限負載加載。但是，您對刪除的空白是正確的。 '.replace（/> \ s *''）是有問題的代碼。我已經轉向簡單地解析新的偏移量並更新它們，而不是完全替換「nav」。感謝你的協助！ – rockerest 2012-04-06 21:09:46

頁面佈局略有變化，無風格變化

回答

相關問題