SlideShare a Scribd company logo
SmartPhone
 JS


      #gunmaweb
http://gunma-web.org/gunma-map/
※         SEO


                     w
HTTP
  Server         Apache

    DB            MySQL

Frame Work     Sinatra( Ruby )

 Javascript   Jquery Mobile
Jquery Mobile
1. Jquery Mobile
2.
3.        method
4.
5.
 ※

                   4
jQuery


(Smart Phone)


                5
1.

2.

3.   (HTML)
      6
http://www.youtube.com/
 watch?v=GWbdIB3iYBo
           7
http://www.youtube.com/
watch?v=GaqTNE7Z4Ag
           8
<div id="home" data-role="page" data-theme="d">
  <div data-role="header">
    <h1>TiTle</h1>
  </div>
  <div data-role="content">
    <ul data-role="listview" data-inset="true">
     <li><a href="#A">Go to A</a></li>
    </ul>
  </div>
</div>
<div id=”A” data-role="page" data-theme="d">
  A
</div>
                                  9
http://www.youtube.com/
 watch?v=0pOnjgmSda0
           10
$.mobile.pageLoading(); #loading
$.mobile.changePage("#confirm_map_contents",
"slide"); #
$.mobile.pageLoading(true); #loading



       ※ajax

                           11
2   ajax
    Forum                                             method


    listview(); button(); .....etc....



                            CSS
            ...                          α ...

                                                 12
α      β



Dreamweaver




                  13
JqTouch
1. jqtouch
2.
3.           method
4.

     ※

                      14
jQuery


(Smart Phone)
   (                 )
                15
1.
2.   (!?            )
3.         (HTML)
4.
            16
http://www.youtube.com/
 watch?v=VwZsTv-z3Ng
           17
http://www.youtube.com/
 watch?v=AFXizPeuBZk
           18
19
<div id="home">
  <div class=”toolbar”>
    <h1>TiTle</h1>
  </div>
  <ul>
     <li><a href="#A">Go to A</a></li>
  </ul>
</div>
<div id=”A”>
  A
</div>

                                  20
http://www.youtube.com/
 watch?v=58k_GdRoatk
            21
;




var jQT = $.jQTouch();
jQT.goTo(“#          ID   ”,”slide”); #




       ※ajax

                            22
#home
             ....orz



        β


            23
sencha touch
( sencha touch                            )
※sencha touch                     ( 2011/05
    )
※                  2010/11




                             24
J S Smartphone

More Related Content

What's hot

การเรียกใช้และการเปลี่ยนรูปแบบการแสดงข้อมูลในไฟล์และโฟลเดอร์
การเรียกใช้และการเปลี่ยนรูปแบบการแสดงข้อมูลในไฟล์และโฟลเดอร์การเรียกใช้และการเปลี่ยนรูปแบบการแสดงข้อมูลในไฟล์และโฟลเดอร์
การเรียกใช้และการเปลี่ยนรูปแบบการแสดงข้อมูลในไฟล์และโฟลเดอร์
เทวัญ ภูพานทอง
 
观剧卡免费赠读者
观剧卡免费赠读者观剧卡免费赠读者
观剧卡免费赠读者
sugeladi
 
Código
CódigoCódigo
Código
Marthaa Hdz
 
Códigos anti-plágio para Blogger
Códigos anti-plágio para BloggerCódigos anti-plágio para Blogger
Códigos anti-plágio para Blogger
Karol Rabêlo
 
Android app - Creating Live Wallpaper (tamil)
Android app - Creating Live Wallpaper (tamil)Android app - Creating Live Wallpaper (tamil)
Android app - Creating Live Wallpaper (tamil)
Dr. Ramkumar Lakshminarayanan
 
การแทรกสัญลักษณ์หน้าข้อความ
การแทรกสัญลักษณ์หน้าข้อความการแทรกสัญลักษณ์หน้าข้อความ
การแทรกสัญลักษณ์หน้าข้อความ
เทวัญ ภูพานทอง
 
0123 24 小时商报读者热线
0123 24 小时商报读者热线0123 24 小时商报读者热线
0123 24 小时商报读者热线
sugeladi
 
Contes 66pdf
Contes 66pdfContes 66pdf
Contes 66pdf
anatole21
 
Sumahex
SumahexSumahex
Sumahex
jbersosa
 

What's hot (10)

การแทรกรูปภาพ
การแทรกรูปภาพการแทรกรูปภาพ
การแทรกรูปภาพ
 
การเรียกใช้และการเปลี่ยนรูปแบบการแสดงข้อมูลในไฟล์และโฟลเดอร์
การเรียกใช้และการเปลี่ยนรูปแบบการแสดงข้อมูลในไฟล์และโฟลเดอร์การเรียกใช้และการเปลี่ยนรูปแบบการแสดงข้อมูลในไฟล์และโฟลเดอร์
การเรียกใช้และการเปลี่ยนรูปแบบการแสดงข้อมูลในไฟล์และโฟลเดอร์
 
观剧卡免费赠读者
观剧卡免费赠读者观剧卡免费赠读者
观剧卡免费赠读者
 
Código
CódigoCódigo
Código
 
Códigos anti-plágio para Blogger
Códigos anti-plágio para BloggerCódigos anti-plágio para Blogger
Códigos anti-plágio para Blogger
 
Android app - Creating Live Wallpaper (tamil)
Android app - Creating Live Wallpaper (tamil)Android app - Creating Live Wallpaper (tamil)
Android app - Creating Live Wallpaper (tamil)
 
การแทรกสัญลักษณ์หน้าข้อความ
การแทรกสัญลักษณ์หน้าข้อความการแทรกสัญลักษณ์หน้าข้อความ
การแทรกสัญลักษณ์หน้าข้อความ
 
0123 24 小时商报读者热线
0123 24 小时商报读者热线0123 24 小时商报读者热线
0123 24 小时商报读者热线
 
Contes 66pdf
Contes 66pdfContes 66pdf
Contes 66pdf
 
Sumahex
SumahexSumahex
Sumahex
 

Viewers also liked

Fxos lt
Fxos ltFxos lt
Fxos lt
Net Kanayan
 
Blueberrypi
BlueberrypiBlueberrypi
Blueberrypi
Net Kanayan
 
Smart phone gunma.web
Smart phone gunma.webSmart phone gunma.web
Smart phone gunma.web
Net Kanayan
 
FileReader and canvas and server silde
FileReader and canvas and server sildeFileReader and canvas and server silde
FileReader and canvas and server silde
Net Kanayan
 

Viewers also liked (7)

Ll xcode
Ll xcodeLl xcode
Ll xcode
 
Fxos lt
Fxos ltFxos lt
Fxos lt
 
Blueberrypi
BlueberrypiBlueberrypi
Blueberrypi
 
Smart phone gunma.web
Smart phone gunma.webSmart phone gunma.web
Smart phone gunma.web
 
2010 12gunmaweb
2010 12gunmaweb2010 12gunmaweb
2010 12gunmaweb
 
Ssl
SslSsl
Ssl
 
FileReader and canvas and server silde
FileReader and canvas and server sildeFileReader and canvas and server silde
FileReader and canvas and server silde
 

More from Net Kanayan

Osc16gm
Osc16gmOsc16gm
Osc16gm
Net Kanayan
 
Open source
Open sourceOpen source
Open source
Net Kanayan
 
Http2入門の入門
Http2入門の入門Http2入門の入門
Http2入門の入門
Net Kanayan
 
Es6 cognition
Es6 cognitionEs6 cognition
Es6 cognition
Net Kanayan
 
ES6 はじめました
ES6 はじめましたES6 はじめました
ES6 はじめました
Net Kanayan
 
Browser push notifications
Browser push notificationsBrowser push notifications
Browser push notifications
Net Kanayan
 
Basic vulnerability
Basic vulnerabilityBasic vulnerability
Basic vulnerability
Net Kanayan
 
Windows store app html
Windows store app htmlWindows store app html
Windows store app html
Net Kanayan
 
Nseg jquery mobile
Nseg jquery mobileNseg jquery mobile
Nseg jquery mobile
Net Kanayan
 
Html5 css3 websocket
Html5 css3 websocketHtml5 css3 websocket
Html5 css3 websocket
Net Kanayan
 

More from Net Kanayan (20)

Osc16gm
Osc16gmOsc16gm
Osc16gm
 
Open source
Open sourceOpen source
Open source
 
Http2入門の入門
Http2入門の入門Http2入門の入門
Http2入門の入門
 
Es6 cognition
Es6 cognitionEs6 cognition
Es6 cognition
 
ES6 はじめました
ES6 はじめましたES6 はじめました
ES6 はじめました
 
Image convert
Image convertImage convert
Image convert
 
Browser push notifications
Browser push notificationsBrowser push notifications
Browser push notifications
 
Http
HttpHttp
Http
 
Basic vulnerability
Basic vulnerabilityBasic vulnerability
Basic vulnerability
 
Windows store app html
Windows store app htmlWindows store app html
Windows store app html
 
Js kusen
Js kusenJs kusen
Js kusen
 
Sass less
Sass lessSass less
Sass less
 
Web creed
Web creedWeb creed
Web creed
 
Js mvc
Js mvcJs mvc
Js mvc
 
Tdd&peapro
Tdd&peaproTdd&peapro
Tdd&peapro
 
Nseg jquery mobile
Nseg jquery mobileNseg jquery mobile
Nseg jquery mobile
 
Smart phone
Smart phoneSmart phone
Smart phone
 
Html5 css3 websocket
Html5 css3 websocketHtml5 css3 websocket
Html5 css3 websocket
 
Gunma ruby
Gunma rubyGunma ruby
Gunma ruby
 
Gunmaweb
GunmawebGunmaweb
Gunmaweb
 

J S Smartphone

Editor's Notes

  1. \n
  2. \n
  3. \n
  4. \n
  5. \n
  6. \n
  7. \n
  8. \n
  9. \n
  10. \n
  11. \n
  12. \n
  13. \n
  14. \n
  15. \n
  16. \n
  17. \n
  18. \n
  19. \n
  20. \n
  21. \n
  22. \n
  23. \n
  24. \n
  25. \n