ajax의 정의

XHTML, CSS, 자바스크립트 등의 기술이 고루 섞여 대화형 웹어플리케이션을 만들 수 있게 하는 웹프로그래밍 기술의 복합체. 비동기식 자바스크립트와 XML(Asynchronous JavaScript And XML)의 줄임말이다.

   설명

이 스크립트는 ajax를 이용하여 페이지로딩을 그때그때해주어 순간 페이지 로딩속도가 매우 빠르다.
각각의 탭메뉴의 내용이 따로 존재하고 클릭시에 그파일을 로딩하기때문에 재작도 편하며, 로딩속도가 매우 빠르다.

   수정할부분

<script type="text/javascript" src="ajaxtabs/ajaxtabs.js">
<link rel="stylesheet" type="text/css" href="ajaxtabs/ajaxtabs.css" />
위의 부분이 꼭 들어가야 합니다.

<ul id="maintab" class="shadetabs">
<li class="selected"><a href="#default" rel="ajaxcontentarea">Intro</a></li>
<li><a href="external.htm" rel="ajaxcontentarea">Bird</a></li>
<li><a href="external2.htm" rel="ajaxcontentarea">Dog</a></li>
<li><a href="external3.htm" rel="ajaxcontentarea">Cat</a></li>
<li><a href="external4.htm" rel="ajaxcontentarea">Sea Otter</a></li>
</ul>

<div id="ajaxcontentarea" class="contentstyle">
<p>This is some default tab content, embedded directly inside this space and not via Ajax. It can be shown when no tabs are automatically selected, or associated with a certain tab, in this case, the first tab.</p>
</div>

<script type="text/javascript">
//Start Ajax tabs script for UL with id="maintab" Separate multiple ids each with a comma.
startajaxtabs("maintab")
</script>

rel="ajaxcontentarea" 이부분이 ajaxcontentarea 라는부분에 해당링크의 페이지를 표시하라는 말입니다.
즉 레이어(div) 아이디가 ajaxcontentarea 인 부분에 표시하게 됩니다.