jquery.innerfade.js 플러그인을 사용해서 이미지 페이드인/페이드아웃 시키는 스크립트입니다.

스크립트 파일은 첨부파일로 첨부했습니다.

혹시나 위 스크립트가 동작되지 않는다면 본문의 첨부파일을 다운로드받으셔서 적용해보시기 바랍니다.

1. html 마크업이랑 css를 분리했습니다.
2. 제이쿼리에서 해당 이미지의 height가 auto로 잡히면서 테이블을 벗어나서 강제로 height를 300px로 고정했습니다.
3. 제이쿼리가 로딩되면서 이미지 위치가 오른 쪽 가장자리로 벗어나서, 감싸는 div에 가로 마진 auto를 지정해서 가운데 정렬했습니다.
4. 기타 css로 이미지 display 설정을 변경하도록 했습니다.
5. 스크립트에서는 $를 처음에 안 붙이면 해당 플러그인이 로딩이 안될 수 있으니 주의해서 사용하세요.