SPATIUM Desktop
주소복사
About Operating System Languages Tools Favorites Notice Visit TEST  
     Mobile Web Test
     Responsive Web
     Google Map
     String CSS
     menu Test
  Location United States
  IP Address 18.97.9.172
2024. 12
1234567
891011
12
1314
15161718192021
22232425262728
293031

 

Mobile Web TEST PAGE LINK

Mobile Page Test - 버전 별 에러가 발생하므로 jquerymobile.com 에서 추천하는 버전 사용

  • jquery.mobile-1.0.1.css
  • jquery-1.6.4.js
  • jquery.mobile-1.0.1.js

* css 다운로드 이후 사용시 images 폴더 이미지도 다운받아야 함

참고 URL :
    - http://jquery.com/ , http://jquerymobile.com/

 

Mobile Web TEST : 디자인 없이 jquery_mobile CSS 로만 UI 구성, 테스트 하였습니다.


1. Listview

 1) Listview, 간단한 페이지 레이아웃(listview) 테스트

    - http://www.spatium.co.kr/test/jQuery/m_listview.html

 2) Listview, 동일 페이지 css 를 이용, 다른 페이지 처럼 처리( 소스상 한 파일에 존재 but 두페이지 처럼 처리)

    - http://www.spatium.co.kr/test/jQuery/m_listview_otherpage.html

 3)  Listview, 위 2번에서 페이지 이동 시 효과

    - http://www.spatium.co.kr/test/jQuery/m_listview_otherpage_eff.html

 4) Listview + list-divider, 테스트

    - http://www.spatium.co.kr/test/jQuery/m_listview_divider.html

 5) Listview + 그룹핑, 처리

    - http://www.spatium.co.kr/test/jQuery/m_listview_group.html

 6) Listview + 그룹핑, 추가 설명과 카운터

    - http://www.spatium.co.kr/test/jQuery/m_listview_group_desc.html

 7) Listview + 그룹핑 add ImageIcon

    - http://www.spatium.co.kr/test/jQuery/m_listview_group_image.html

 8) Listview + data-filter 사용, 검색

    - http://www.spatium.co.kr/test/jQuery/m_listview_datafilter.html

 

2. Input Type

 1) Input, test & password

    - http://www.spatium.co.kr/test/jQuery/m_input_text.html

 2) Input, radio & checkbox

    - http://www.spatium.co.kr/test/jQuery/m_input_radio.html

 3) Input, select & textarea Tag

    - http://www.spatium.co.kr/test/jQuery/m_input_select.html

 4) Input, range(slider) & search type

    - http://www.spatium.co.kr/test/jQuery/m_input_slider.html

 5) Collapsible(Accordion)

    - http://www.spatium.co.kr/test/jQuery/m_accordion.html

 6) Collapsible-set

    - http://www.spatium.co.kr/test/jQuery/m_accordion_set.html

 

3. UI (Layout)

 1) ui-grid

    - http://www.spatium.co.kr/test/jQuery/m_ui.html

    - test : http://www.spatium.co.kr/test/jQuery/m_ui_test.html

 2) Header & Footer Fixed ( fafault : data-position = inline )

    - http://www.spatium.co.kr/test/jQuery/m_ui_header_fixed.html

 3) navbar(Navigation bar) in header

    - http://www.spatium.co.kr/test/jQuery/m_ui_navbar.html

 

4. Geolocation

 1) geolocation

    - http://www.spatium.co.kr/test/jQuery/m_geolocation.html

 

5. Touch event

 1) Flick effect, 모바일에서 이미지를 터치 후 밀어서 다음 이미지 보기에 사용(PC 에서는 마우스로 이용)

    - http://www.spatium.co.kr/test/jQuery/flick.html

 

 

 

 


Copyright (C) SPATIUM. All rights reserved.
[SPATIUM]WebMaster Mail