본문 바로가기

javascript62

[책] p250 위치 정보 독자 분들께서 문의 해주신 jQuery Mobile 완벽가이드 책의 위치 정보 관련 내용입니다. 문의) p253의 위치 정보 가져오기가 성공했을 경우에 현재 위치를 지도에 보여줘야 하는데, 초기 변수 값의 위도와 경도의 위치로만 지도에 나타납니다. 답변) 1. 위치 정보 가져오기가 성공했는지 확인해 주세요 위치 정보를 가져오기가 성공했을 때 호출되는 콜백 함수를 아래와 같이 수정합니다.지도 화면이 뜨기 전에 alert 창으로 위도와 경도의 값이 화면에 보여진다면 정상적으로 위치 정보를 가져온 것입니다. function geoSuccess(position){//alert("성공");latitude = position.coords.latitude;longitude = position.coords.longit.. 2012. 5. 12.
[책] p271 내부 스크롤 (nested scroll) 독자 분들께서 문의 해주신 jQuery Mobile 완벽가이드 책의 내부 스크롤 관련 내용입니다. 문의) p271의 내부 스크롤 내용 중에서 data-scroll='x'의 경우 스크롤이 원래상태로 돌아가 버립니다.스크롤된 상태를 유지 할려면 어떻게 하면 되는지요? 답변) 1. 예제 파일 : cp4_scroll.html2. 아래와 같이 x 축 스크롤 부분에 class="scrollBtn" 를 첫번째 태그에서 삭제하시고 두번째 div 태그에 추가해주세요 button A...button L 3. CSS를 정의하고 있는 scroll.css 파일을 열어 주시고,4. 아래와 같이 scrollBtn 속성을 변경해 주세요. .scrollBtn{height: 70px;width: 1400px;} 5. 웹페이지에서 다시 .. 2012. 5. 12.
[책] jQuery Mobile 완벽 가이드 [jQuery Mobile 완벽 가이드] 저자: 김철우출판사: 디지털북스출간일 : 2012년 4월 10일 작년 말부터 준비하던 책이 드디어 온라인 서점에서 판매를 시작했습니다.^^ 고생도 많이 했지만, 참 뿌듯한 일이였던 것 같습니다. 주위에서도 같이 기뻐해주시고 응원해주신 덕분에 이런 결과가 있을 수 있었던 것이라고 생각합니다. 특히나, 제가 책을 쓴답시고 방에서 노트북과 씨름하고 있을 때 엄청난 인내심으로 내조를 해준 우리 와이프에게 너무 사랑한다는 말을 전합니다. 국내 서적중에서는 단독으로 jQuery Mobile에 대해서 다룬 가장 첫번째 책이 아닌가 싶습니다. 그 동안에는 이런 저런 모바일 기술들과 합쳐서 백과사전 같은 책들이 몇 권 나왔지만, 다루는 내용이 조금만 관심이 있더라도 알 수 있는 .. 2012. 4. 7.
jQuery Mobile 1.0.1 released 최근 정식 버젼 이후 첫번째 업데이트가 공개되었습니다. 변경 사항은 다음과 같습니다. 1. 삼성의 bada 플래폼과 Dolphin browser 지원 2. 중국에서 인기 브라우저인 UC browser 지원 삼성 바다도 지원해주다니 jQuery Mobile은 어느 브라우저에서도 동일하게 동작하는 보편화된 프레임워크가 될 것 같습니다. 좀 천천히 업데이트 해도 좋으련만.^^ 2012. 1. 28.
jQuery Mobile 1.0RC3 Released 정말 최종 버젼이 될 RC3이 발표되었습니다. 이번달 내에 정식 버젼이 나올 기세입니다.^^ 이번에 개선된 최대 이슈는 성능입니다. 1.0버젼에서 핵심이 될 성능 개선은 page rendering 속도입니다. 그외의 터치 이벤트와 페이지 전환등의 성능 개선은 1.1버젼에서 고려할 예정이라고 합니다. 이번 RC3에서는 RC2보다 페이지 랜더링 속도가 약 30~50% 개선이 되었다고 소개하고 있습니다. 보다 복잡한 위젯이 포함되어 있는 페이지에서는 약 2.5배의 속도차이가 난다고 합니다. 페이지가 복잡해 질수록 더욱 개선된 랜더링 속도를 느낄 수 있다고 합니다. jQuery core 1.6.4 이번에 출시될 1.0버젼에서는 jquery core 1.6.4버전을 지원하게 될 것이고, 1.7버전은 JQM 1.1.. 2011. 11. 15.
jQuery Mobile 1.0RC2 Released 마지막 RC 버젼이 지난주에 출시되었습니다. 이제 몇 주 후면 정식 버젼을 볼수 있을 것 같습니다. 주요 변경사항 1. HTML5의 새로운 input type 향상 input 태그의 time, date, month, week, datatime, datetime-local, color 타입에 대한 스타일 지원이 추가되었습니다. 브라우저에 따라 다르게 보여지며, 새로운 버젼의 크롬과 사파리에서는 spinner control로 보여지고, IOS5에서는 slick picker control의 형태로 보여집니다. 2. 새로운 helper class 새로운 .ui-hidden-accessible class가 추가되었습니다. 일반 스크린에서는 숨겨지고, 스크린 리더와 검색 엔진에게는 보여지는 요소에 추가할 수 있습니.. 2011. 10. 24.
jQuery Mobile 1.0 RC1 Released jQuery Mobile이 드디어 rc1 버젼이 나왔습니다. 앞으로 몇가지의 후보군들을 빠르게 출시하고 몇주 후에 정식 1.0버젼을 출시할 계획이라고 합니다. 이번에 변경된 내용을 간단하게 살펴보겠습니다. 1. Collapsibles의 디자인 개선 접기 요소와 아코디언 위젯의 비쥬얼 디자인이 개선되었습니다. data-content-theme 속성을 추가해 테마를 적용할 수 있게 되었습니다. 펼쳐진 내용에는 테두리가 적용되고 배경색상을 적용할 수 있고, 테마도 적용할 수 있게 되었습니다. 2. IOS5 transitions & fixed toolbars 새로나올 IOS5의 페이지 전환과 고정 툴바가 개선되었습니다. 정식으로 IOS5가 출시될때까지 기다리기 위해 디폴트 속성에서 제외시켰다고 합니다. 또, 복.. 2011. 10. 2.
jQuery Mobile Beta 3 released 어제 베타3 버젼이 나왔습니다. 위에 글에 의하면 이번버젼이 베타버젼의 마지막 릴리즈라고 합니다. 다음달쯤에는 RC1 버젼을 계획하고 있다고 하네요. 이제 정식 런칭할 시기가 얼마 남지 않은 것 같습니다. 멋지게 변모하길 기대하면서~^^ 이번에 변경된 내용을 간단하게 살펴 보겠습니다. 1. pushState : ajax기반의 깔끔한 url 그동안 페이지 이동시 url에 보여지던 해쉬 페이지명이 사라졌습니다. 기술적으로는 history.replacestate() 함수를 이용하여 hashchange-based navigation model에서 pushState 기능을 제공한다고 되어있네요. 이 기능은 기존 브라우저들 뿐만아니라 안드로이드 허니콤과 곧 출시될 ISO5의 브라우저에서도 지원된다고 합니다. 이 기.. 2011. 9. 9.
jQuery Mobile Beta 2 released jQuery Mobile 베타2 버젼이 발표되었습니다. 다음달경에 베타3가 발표될 예정이라고 안내하고 있네요. 업그레이드된 주요 내용을 간단히 살펴봤습니다. 1. 지원 플레폼 추가 기존 지원가능한 플레폼에서 안드로이드2.3, 허니폰 타블렛, HP 팝 webos 3.0, 노키아 S60 지원이 추가되었네요. 2. 위젯의 decoupled 여러 위젯이 디커플링 빌드가 가능합니다. 그중에 특히 page 속성인 header, content, footer가 필요하지 않는 경우에 삭제가 가능해졌습니다. 3. 모든 위젯을 한번에 향상시킬 수 있는 "create"이벤트 신규 추가 페이지가 로딩될때 JQM은 마크업 위젯들을 찾아 향상된 버젼으로 변화시킵니다. 그런데, 이런 향상기능을 개별 위젯에 적용할 수 없어서 refr.. 2011. 8. 4.
jQuery Mobile - API media, active state 알파 버전에서 있었던 Media Query Helper Classes는 beta 버전으로 오면서 사용이 중지 되었다고 합니다. CSS3를 사용해서 할 것을 추천한다고 되어있네요. 이 내용은 orientation과 breakpoint와 $.mobile.media()를 사용한 미디어 쿼리로 구성되어 있는데, 추천되어진 것처럼 CSS3로 충분히 구현 가능하니, 자세한 내용은 기술하지 않을 생각입니다. 관심 있으신 분은 아래 링크에서 보시면 될 것 같습니다. http://jquerymobile.com/demos/1.0b1/docs/api/mediahelpers.html Global “Active” state jQuery Mobile 프레임워크는 어떤 요소가 선택되었을 때 “active”라고 불려지는 테마를 사용.. 2011. 7. 18.