회사 홈페이지를 가져다 모바일로 만들려니 쉽지 않군요.
JQueryMobile 홈페이지를 최대한 배껴서.. 나름 만들어 봤습니다.
역시 아이폰에서는 잘 나오는 군요.. ㅎㅎ
http://m.globalsoft.co.kr로 만들어 놨으니 테스트 해 보시고 문제 있으면 알려주세요.
사파리 하고 아이폰으로만 테스트 하고 있어서 다른 환경에서는 잘 되는지 모르겠네요.
사이트는 계속 변경될 예정 입니다. 그냥 공부겸 테스트 겸 뭐 이런거니.. 양해하시고 봐 주세요.
1, 메인페이지 디자인 변경
메인페이지에서는 테마에 대한 설정으로 기존 에 구성한 값에 대한 변경 작업을 진행 함.
.auto-small 스타일
<body>
<div data-role="page" data-theme="d">
ß data-theme="d"로 선언을 하여 바탕화면색은 하얀색으로 지정
관련 테마에 대한 설명은 JQueryMobile.com 에서 확인 가능 함.
<div data-role="header" data-theme="e">
ß header 내용을 생략하고 회사로고 위의 허전함을 없애기 위해
테마 e를 선택하여 지정하여 표현 함.
</div>
2. 회사소개 구성 만들기 및 하위 페이지 만들기
아래 화면으로 구성하였습니다.
이메일 문의하기는 mailto를 사용하여 메일을 보낼수 있게 구성하였으며,
전화걸기를 누르면 전화 통화가 바로 가능하게 구성하였습니다.
Default.html 문서에 아래와 같은 내용을 추가 하였음.
회사소개 페이지와 찾아오시는 길 두개의 페이지를 만들었으며, 이메일 문의하기와 전화걸기는
간단하게 테그 처리로 완료 함.
회사소개 페이지는 아래와 같이 HTML 테이블을 이용하여 표현 함.
단 data-theme로 바탕화면에 대한 설정을 변경 함.
찾아오시는 길은 간단하게 이미지를 넣고 주소 값만 넣어 완성 함.
댓글