javascript - 页面布局略有变化，样式无变化

Question

我正在重新设计my personal / development website ，并尽力使其尽可能用户友好。

我想使用 AJAX 加载新页面并将其滑入，这就是当前正在发生的事情。一切都可以在所有当前浏览器中工作(IE 除外，但我将来会致力于此)。

但是，在第一个(并且只有第一个)页面更改时，我的导航菜单中出现了奇怪的间距跳跃。页面更改一次后，导航间距保持不变。

• 页面加载时
  
• 点击链接后

当点击链接时，新页面的导航部分将被设置为替换当前导航，因为每个链接都有一个由服务器后端计算的数据偏移属性，以便 JavaScript知道单击元素时向哪个方向滑动元素以及滑动多远。

我目前的做法是[内容宽度]或-[内容宽度]。

但是，菜单的结构永远不会改变，并且样式表是完全静态的。我已经检查了 Firebug 中的所有这些元素，页面加载过程中没有任何变化。

我链接了the site, http://next.randolphwebdevelopment.com上面，但我将在此处复制一些相关的 Javascript 以了解正在发生的情况。

<小时/>

下 zipper 接将重定向到的整个页面(除非指定，所有 future 的代码块也都在此回调内):

$.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,'><'));

用目标页面的新导航替换导航(真正改变的是每个链接上的data-offset属性):

//insert the new navigation
$('#header-content nav').html(next_page.find('#header-content nav').html());
$('#header-content nav a').click( navigation_clickHandler );

<小时/>

确实是这样。有一堆代码用于插入新内容并将其滑入，以及更改页面标题、设置历史状态等，但这是唯一涉及导航菜单的代码，并且没有涉及任何样式表的代码.

我愿意接受任何解决问题和/或改进代码设计的建议。

Answer 1

首次加载 nav是从服务器获取的，没有 php。我敢打赌，您是出于意图等手动编写此 html 的。

任何点击后js重新创建nav ，但现在没有空文本节点。就<a>link1</a><a>link2</a> .

添加空格或从源 html 中删除空格。