활동보고/사진자료

그림1 자바스크립트를 이용한 슬라이드


요즈음 같이 기자회견도 많고 여러 활동이 많아 사진자료실의 내용들도 금방금방 업뎃이 되고 있습니다. 최신의 사진자료 9개까지 슬라이드로 볼 수 있도록 했습니다. 센스있으신 분들은 금방 눈치 채셨겠지만, 이 버튼

을 눌러  슬라이드 기능을 이용하실 수 있습니다. 홈페이지에 접근했을 때, 방문한지 몇일 되었다면 활동사진리스트 페이지로 이동하지 않더라고 최근 몇일간의 사진들을 보실 수가 있겠죠? 개발자의 입장에서는 방문자가 홈페이지에 방문했을 때 머무는 시간을 좀더 늘리게 하는 효과를 기대할 수가 있습니다.

모든사용자를 위한 배려

이 슬라이드는 자바스크립트라는 언어를 통해 만들었습니다.그렇다면 자바스크립을 꺼두었거나 사용하기 싫어하시는 분들은요? 그래서 자바스크립트를 사용하던 사용하지 않던 '활동보고/사진자료'란을 이용할 수 있도록 신경을 썼습니다. 당연히도 익스플로러6, 익스플로러7, 익스플로러8, 파이어폭스에서도 호환되도록 했습니다.(다른 브라우져는 시험해보지는 않았습니다. 누가 해보심..얘기해주삼.)

자바스크립트를 꺼두었을 때 활동보고/사진자료

그림2 자바스크립트를 꺼두었을 때 활동보고/사진자료


위 그림2는 자바스크립트를 껐을 때의 화면입니다. 그림1과의 차이점은 슬라이드를 넘기는 화살표가 없는 거죠. 그 때문에 9개 중 가장 최신의 3개만 볼 수 있겠죠?  제가 예상못한 버그가 있다면 서슴없이 댓글을 남겨주세요^^

혹시 원치않게 자신의 브라우져가 자바스크립트 비활성화되어 있는데 다시 자바스크립트를 활성화하고 싶다면 아래의 글을 펼쳐서 참고하십시요

더보기




여기부터는 기술적인 부분입니다. 관심있으시다면 펼쳐서 보시길

제가 중요하게 생각한 알고리즘은 재사용성입니다. <ul>태그의 총 개수만 알면 알아서 계속 로테이션방식으로 슬라이드가 이루어 지도록 한거죠. 슬라이드 시킬 단위를 <ul>로 감싸는 작업만 해준다면 다른 슬라이드도 아래의 코드로 적용이 가능합니다.

더보기




이전 1 ... 15 16 17 18 19 20 21 22 23 ... 26 다음