오늘 간단한 작업이 들어왔다.
왼쪽 메뉴를 클릭했을때 컨텐츠 부분을 로드하는것이다. 프로모션 성이라 따른 특별한 비즈니스 로직이 없었다.
그리하여 외쪽 탭을 클릭했을때 jquery 의 load를 함 써봤다.
왜? 그냥 .....
한번 코드를 보자.
<div id="contents"></div>
위의 html을 해놓고 document 가 ready 될때 기본적인 contents를 바인딩해준다.
$(document).ready(function () {
$('#contents').load('/hrd/index9.html');
});
그리고 왼쪽 탭에서 클릭 엑션이 일어났을때...
<a href="javascript:fn_chagneContents('album.html',2)">앨범</a>
자바스크립트를 호출하여 해당 html을 로드한다.
function fn_chagneContents(fileName,index) {
var path = '/hrd/' + fileName;
$('#leftMenu img').each(function () {
var src = this.src.replace('_on', '');
this.src = src;
});
$('#img' + index).attr('src', 'http://img.hunet.co.kr/hunet/hrd_leadersforum/2011_9th/common/menu_0'+index+'_on.gif');
$('#contents').load(path);}
끝 위의 코드는 내가 쓴 코드다.... 우리는 디자이너들이 이미지를 넘 좋아해서리 클릭이 일어날때
on 이미지를 각각 하나씩 더 만들어 준다.