페이지 레이아웃이 약간 변경되고 스타일이 변경되지 않습니다.

Question

my personal/development website을 재 설계하고 가능한 한 사용자 친화적으로 만드려고합니다.

AJAX로 새 페이지를로드하고 슬라이드하려고했는데 현재 진행되고 있습니다. 모두 은 현재 브라우저 (IE는 제외)에서 모두으로 작동하지만 앞으로는 그 문제를 해결할 예정입니다.

그러나 내 탐색 메뉴에 이상한 간격이있어서 첫 번째로 페이지 만 바뀝니다. 페이지가 한 번 변경되면 탐색 간격도 동일하게 유지됩니다. 링크를 클릭하면 링크가

를 클릭하면 페이지로드

에

• 후 새 페이지에서 탐색 섹션은, 현재의 내비게이션을 대체하도록 설정되어 각 링크 때문에 데이터 오프셋 특성이 있습니다.이 특성은 서버 백엔드에서 계산되므로 클릭 할 때 요소를 슬라이드하는 방향과 방향을 자바 스크립트가 알 수 있도록합니다. [내용 폭] -이 중 [내용 폭] 또는 의

  나는 현재를하고 있어요 방법.

  그러나 메뉴의 구조는 이 아니며으로 변경되지 않으며 스타일 시트는 완전히 정적입니다. Firebug에서 이러한 모든 요소를 ​​검사 했으므로 페이지로드가 변경되지 않습니다.

  나는 위의 the site, http://next.randolphwebdevelopment.com을 연결했으나, 여기에 적절한 자바 스크립트를 복사하여 어떤 일이 일어나고 있는지 알려줍니다.

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

  ---

  : 페이지 (정말 변화 모든 각 링크에 데이터 오프셋 속성입니다)

  정말 대단합니다. 새로운 내용을 삽입하고 그것을 밀어 넣을뿐 아니라 페이지 제목을 변경하고, 기록 상태를 설정하는 코드가 많이 있습니다. 그러나이 코드는 탐색 메뉴를 터치하는 유일한 코드이며, 스타일 시트를 만지는 코드는 없습니다 .

  문제를 해결하고 코드 디자인을 개선 할 수있는 의견이 있으면 언제든지 열어 볼 수 있습니다.

Answer 1

처음로드시 nav은 PHP가없는 서버에서 가져옵니다. 나는이 html을 의도적으로 수동으로 썼다고 생각한다.

클릭 후 js는 nav을 다시 작성하지만 이제는 빈 텍스트 노드가 없습니다. 그냥 <a>link1</a><a>link2</a>.

소스 html에서 공백을 추가하거나 제거하십시오.