Ȩ | ·Î±×ÀÎ | ȸ¿ø°¡ÀÔ | °í°´¼¾ÅÍ
 
HOME > »õ·Î³ª¿ÂÃ¥
 
 
: : ÇǾ¾ºÏÀÔ´Ï´Ù. : :
Á¦¸ñ : ¸ð¹ÙÀÏ À¥°ú À¥¾ÛÀ» À§ÇÑ jQuery Mobile
ÆäÀÌÁö : 604P
Á¤°¡ : 26,000¿ø
ÆÇÇü : 4x6 ¹èÆÇ
¹ßÇàÀÏ : 2012³â 4¿ù 18ÀÏ
ÀúÀÚ : À̵ÎÁø
¿ä¾à :

º»¼­´Â Ãʺ¸ ÇÁ·Î±×·¡¸Ó´Â ¹°·Ð À¥ µðÀÚÀ̳ʵ鵵 ¸ð¹ÙÀÏ °ü·Ã ½º¸¶Æ® µðÀÚÀÎÀ» ÇÒ ¼ö ÀÖµµ·Ï ¾ÆÁÖ ½±°Ô °¡À̵åÇÏ°í ÀÖ½À´Ï´Ù. jQuery MobileÀÇ ÁöÇâÁ¡Àº ´©±¸³ª ½±°Ô »ç¿ëÇÏ°Ô ÇѴٴµ¥ ÀÖ½À´Ï´Ù. º¹ÀâÇÏ°í ¾î·Á¿î ¾ð¾î¸¦ ¹è¿ö¼­ ÇÁ·Î±×·¡¹ÖÀ» ÇØ¾ß ÇÑ´Ù¸é jQuery MobileÀº ¼º°øÇÏÁö ¸øÇßÀ» °ÍÀÔ´Ï´Ù. º»¼­´Â jQuery MobileÀÇ ¸ñÇ¥¿¡ ¸ÂÃç ÇÁ·Î±×·¡¹ÖÀ» ¸ð¸£´Â À¥ µðÀÚÀ̳ʵ鵵 ½±°Ô jQuery MobileÀ» »ç¿ëÇÒ ¼ö ÀÖµµ·Ï ¹è·ÁÇÏ°í ÀÖ½À´Ï´Ù.

£Û ÀÌ Ã¥¿¡¼­ Á¦½ÃÇÏ´Â ³»¿ë £Ý
 

ÇϳªÀÇ ¼Ò½º·Î µ¥½ºÅ©Åé, ¾Èµå·ÎÀ̵å, ¾ÆÀÌÆù, À©µµ¿ìÆù ½º¸¶Æ® µðÀÚÀÎÀ» ÇÑ´Ù!

 
º»¼­´Â ´ÙÀ½°ú °°Àº µ¶ÀÚ¸¦ ´ë»óÀ¸·Î ÇÕ´Ï´Ù
.

  

* ¸ð¹ÙÀÏ À¥ »çÀÌÆ®¸¦ °³¹ßÇÏ½Ç ºÐ

¸ð¹ÙÀÏ À¥¾ÛÀ» °³¹ßÇÏ½Ç ºÐ

Â÷¼¼´ë À¥ °³¹ß ¹æ¹ý·ÐÀÎ ½º¸¶Æ® µðÀÚÀÎÀ» ÇнÀÇÏ½Ç ºÐ

  

º»¼­´Â Ãʺ¸ ÇÁ·Î±×·¡¸Ó´Â ¹°·Ð À¥ µðÀÚÀ̳ʵ鵵 ¸ð¹ÙÀÏ °ü·Ã ½º¸¶Æ® µðÀÚÀÎÀ» ÇÒ ¼ö ÀÖµµ·Ï ¾ÆÁÖ ½±°Ô °¡À̵åÇÏ°í ÀÖ½À´Ï´Ù. jQuery MobileÀÇ ÁöÇâÁ¡Àº ´©±¸³ª ½±°Ô »ç¿ëÇÏ°Ô ÇѴٴµ¥ ÀÖ½À´Ï´Ù. º¹ÀâÇÏ°í ¾î·Á¿î ¾ð¾î¸¦ ¹è¿ö¼­ ÇÁ·Î±×·¡¹ÖÀ» ÇØ¾ß ÇÑ´Ù¸é jQuery MobileÀº ¼º°øÇÏÁö ¸øÇßÀ» °ÍÀÔ´Ï´Ù. º»¼­´Â jQuery MobileÀÇ ¸ñÇ¥¿¡ ¸ÂÃç ÇÁ·Î±×·¡¹ÖÀ» ¸ð¸£´Â À¥ µðÀÚÀ̳ʵ鵵 ½±°Ô jQuery MobileÀ» »ç¿ëÇÒ ¼ö ÀÖµµ·Ï ¹è·ÁÇÏ°í ÀÖ½À´Ï´Ù.

   

 

º»¼­´Â ´ÙÀ½°ú °°Àº Ư¡ ÀÖ½À´Ï´Ù.

    

µ¥½ºÅ©Å¾, ½º¸¶Æ®Æù, À¥, À¥¾Û µî ¸ðµç ºÐ¾ß¸¦ ´ë»óÀ¸·Î µðÀÚÀÎ ±â¹ýÀ» ¼³¸íÇÏ°í ÀÖ½À´Ï´Ù.

HTML ű׸¦ ±â¹ÝÀ¸·Î Çϱ⠶§¹®¿¡ ÇÁ·Î±×·¡¹Ö °æÇèÀÌ ¾ø¾îµµ ½±°Ô ¹è¿ï ¼ö ÀÖ½À´Ï´Ù.

ÀÚ¹Ù½ºÅ©¸³Æ® Á¶Â÷ Àß ¸ô¶óµµ ÀÌÇØÇÒ ¼ö ÀÖµµ·Ï ÀÚ¼¼ÇÏ°Ô ¼³¸íÇÏ°í ÀÖ½À´Ï´Ù.

jQuery MobileÀÇ ¸ðµç ±â´ÉÀ» ºê¶ó¿ìÀú¿Í ½Ç¹° ½º¸¶Æ®Æù¿¡¼­ ¸ðµÎ Å×½ºÆ®ÇÏ°í ÀÖ½À´Ï´Ù.

ÇÏÀ̺긮µå ºê¸´Áö ¼Ö·ç¼ÇÀ» »ç¿ëÇÏ¿© À¥¾ÛÀ» ¸¸µå´Â ºÐµéÀ» À§ÇØ Æù°¸µµ ¼³¸íÇÕ´Ï´Ù.

³ª¸¸ÀÇ Å׸¶ ¶óÀ̺귯¸®¸¦ ¸¸µå´Â CSS GUI °³¹ßµµ±¸ Å׸¶·Ñ·¯"ÀÇ »ç¿ë¹ýÀ» ¼³¸íÇÕ´Ï´Ù.

ÀÚµ¿À¸·Î È­¸é µðÀÚÀÎÀ» ÇØÁÖ´Â GUI È­¸é ºô´õ "codiqa"ÀÇ »ç¿ë¹ýÀ» ¼³¸íÇÕ´Ï´Ù.

 

  

ÀÌ Ã¥ÀÇ °³·«ÀûÀÎ ±¸¼ºÀº ´ÙÀ½°ú °°½À´Ï´Ù.

  

1Àå 3Àå : À¥°ú À¥¾ÛÀÇ °³³ä, ¾Û °³¹ß ȯ°æÀ» ±¸ÃàÇÏ´Â ¹æ¹ýÀ» ¿ä¾àÇÏ°í, Æù°¸À¸·Î ¾Èµå·ÎÀ̵å, ¾ÆÀÌÆù, À©µµ¿ìÆù¿¡¼­ À¥¾ÛÀ» ¸¸µå´Â ¹æ¹ýÀ» ¼Ò°³ÇÕ´Ï´Ù. ÀÌ ÀåµéÀº À¥¾Û¿¡ °ü½É ÀÖ´Â µ¶ÀÚµéÀ» À§ÇØ Á¦°øµË´Ï´Ù.

  

4Àå 16Àå : jQuery MobileÀ» ÀÌ¿ëÇÑ ½º¸¶Æ® µðÀÚÀÎÀ» ÇÏ´Â ¹æ¹ýÀ» ¼Ò°³ÇÏ°í ÀÖ½À´Ï´Ù. HTML ÄÚ´õ, Àü¹® ÇÁ·Î±×·¡¸Ó, À¥ µðÀÚÀ̳Ê, À¥ ±âȹÀÚ±îÁö ¸ðµÎ ½±°Ô ÀÌÇØÇÒ ¼ö ÀÖµµ·Ï °¡À̵åÇÏ°í ÀÖ½À´Ï´Ù. ºê¶ó¿ìÀú´Â ¹°·ÐÀÌ°í À¥¾Û¿¡¼­ ½ÇÇèÇÑ È­¸éµµ º¸¿©ÁÖ°í ÀÖ¾î Ãʺ¸ÀÚµµ À¥¾Û È­¸é¿¡¼­ °í·ÁÇؾßÇÒ »çÇ×À» Á¡°ËÇÒ ¼ö ÀÖµµ·Ï Çß½À´Ï´Ù.

  

17Àå : À¥µðÀÚÀ̳ʸ¦ À§ÇØ GUI ȯ°æ¿¡¼­ CSS ½ºÅ¸ÀÏ Å׸¶¸¦ ÀÚµ¿À¸·Î ¸¸µé¾îÁÖ´Â “Theme Roller”¿Í ½º¸¶Æ® µðÀÚÀÎÀ» ÄÚµùÇÏÁö ¾Ê°í µðÀÚÀÎÇÒ ¼ö ÀÖ´Â "codiqa"¸¦ ¼Ò°³ÇÏ°í ÀÖ½À´Ï´Ù. Ãʺ¸ÀÚÀÇ °æ¿ì ÀÌ µÎ °³ÀÇ °³¹ßµµ±¸·Î ¸ÕÀú jQuery Mobile¸¦ °æÇèÇÏ´Â °Íµµ ÁÁ½À´Ï´Ù.


18
Àå - 20Àå : ÀÚ¹Ù½ºÅ©¸³Æ®·Î jQuery MobileÀ» Á¦¾îÇÏ´Â ¹æ¹ýÀ» ¼Ò°³ÇÕ´Ï´Ù. ÀÌ ÀåÀ» Àß ¸ô¶óµµ ½º¸¶Æ® µðÀÚÀÎÀ» ÇÏ´Â µ¥´Â ¹®Á¦°¡ ¾øÁö¸¸, ÇÁ·Î±×·¡¸Ó ÀÔÀå¿¡¼­ ½º¸¶Æ® µðÀÚÀÎ È­¸éÀ» Á¦¾îÇÏ¿© ½Éµµ ÀÖ´Â jQuery MobileÀ» ¾Ë°íÀÚ ÇÏ´Â °³¹ßÀÚ¸¦ À§ÇØ Âü°í¼­ ¿ªÇÒÀ» ÇÒ ¼ö ÀÖµµ·Ï ÃÖ´ëÇÑ °ËÁõµÈ »ùÇõé·Î ¼³¸íÇÏ°í ÀÖ½À´Ï´Ù.

 

 

 

£Û ¸ñÂ÷ £Ý
 

1Àå ½º¸¶Æ® µðÀÚÀÎÀ» À§ÇÑ jQuery Mobile


1.1
ÇÏÀ̺긮µå¸¦ ¿Ïº®ÇÏ°Ô ½ÇÇöÇÑ jQuery Mobile

1.2 ÇÏÀ̺긮µåÀÇ Á¤ÀÇ

1.3 À¥¾ÛÀÇ Á¤ÀÇ

1.4 ¹Ì¿Ï¼ºÀÛ À¥¾Û ¼Ö·ç¼Ç

1.5 ¿Ï¼ºµÈ À¥¾Û ¼Ö·ç¼Ç Á¶ÇÕ

  

2Àå ³×ÀÌƼºê ¾Û °³¹ßȯ°æ ±¸Ãà 


2.1
¾Èµå·ÎÀ̵å¿ë °³¹ßȯ°æ ¿ä¾à

2.2 ¾ÆÀÌÆù¿ë °³¹ßȯ°æ ¿ä¾à

2.3 ¿øµµ¿ìÆù °³¹ßȯ°æ ¿ä¾à

2.2 ³×ÀÌƼºê ºê¸´Áö Æù°¸(PhoneGap) ´Ù¿î·Îµå

2.3 ½º¸¶Æ® µðÀÚÀÎ jQuery Mobile ´Ù¿î·Îµå

  

3Àå À¥¾Û°ú jQuery MobileÀÇ ¿¬µ¿ 


3.1
¾Èµå·ÎÀ̵å¿ë À¥¾Û ÇÁ·ÎÁ§Æ®

ÀÌŬ¸³½º Æù°¸ Ç÷¯±×ÀÎ ¼³Ä¡

Æù°¸ ÇÁ·ÎÁ§Æ® »ý¼º

jQuery Mobile ¶óÀ̺귯¸® Æ÷ÇÔ ¿É¼Ç

¾Èµå·ÎÀ̵å ÇÁ·ÎÁ§Æ® À̸§ Á¤ÀÇ

¾Èµå·ÎÀ̵å ÇÁ·ÎÁ§Æ® SDK ¹öÀü Á¤ÀÇ

¾Èµå·ÎÀ̵å ÇÁ·ÎÁ§Æ® ÆÐÅ°Áö À̸§ Á¤ÀÇ

¾Èµå·ÎÀ̵å jQuery Æù°¸ ÇÁ·ÎÁ§Æ® »ý¼º ¿Ï·á

ÀÌŬ¸³½º ¼³Á¤ : workspace ±âº» ÀÎÄÚµù ¼³Á¤

ÀÌŬ¸³½º ¼³Á¤ : À¥ °³¹ß Ç÷¯±×ÀÎ "¾ÛŸ³ª(Aptana)" ¼³Ä¡

ÀÌŬ¸³½º ¼³Á¤ : À¥ Ç¥ÁØ ÄÚµùÀ» À§ÇÑ Validation ¼³Á¤

ÀÌŬ¸³½º ¼³Á¤ : À¥ ÆíÁý±â Å׸¶ ¼³Á¤

jQuery Mobile ¶óÀ̺귯¸® È£Ãâ »ç·Ê

HTML ±¸¼ºÀ» ÇÑ´«¿¡ º¸´Â ÀÌŬ¸³½º "Outline" â

°¡»ó±â±â ÁغñÇϱâ : SDK 4.0.X ¾ÆÀ̽ºÅ©¸² »÷µåÀ§Ä¡ ¹öÀü

¾Èµå·ÎÀ̵å ÇÁ·ÎÁ§Æ® ½ÇÇà ȯ°æ ¼³Á¤

°¡»ó±â±â ½ÇÇàÇϱâ : SDK 4.0.X ¾ÆÀ̽ºÅ©¸² »÷µåÀ§Ä¡ ¹öÀü

°¡»ó±â±â¿¡¼­ jQuery Mobile Æù°¸ µ¥¸ð ¾Û ½ÇÇèÇϱâ

¾Èµå·ÎÀÌµå ½Ç¹° ´Ü¸»±â¿¡¼­ ½ÇÇèÇϱâ

¾Èµå·ÎÀ̵å SDK ¹öÀü º¯°æ : ±¸ ¹öÀüÀ¸·Î ´Ù¿î±×·¹À̵å

½Ç¹° ´Ü¸»±â¿¡¼­ jQuery Mobile Æù°¸ µ¥¸ð ¾Û ½ÇÇèÇϱâ

DDMSÀÇ ½Ç¹° ´Ü¸»±â È­¸é ĸó

½Ç¹° ´Ü¸»±â Æù°¸ µ¥¸ð : ·ÎÄà µ¥ÀÌÅͺ£À̽º(Storage)

½Ç¹° ´Ü¸»±â Æù°¸ µ¥¸ð : ¿¬¶ôó(Contacts)

½Ç¹° ´Ü¸»±â Æù°¸ µ¥¸ð : GPS À§Ä¡ °¨Áö ¼¾¼­(Geolocation)

½Ç¹° ´Ü¸»±â Æù°¸ µ¥¸ð : ´ëÈ­»óÀÚ(Notification)

½Ç¹° ´Ü¸»±â Æù°¸ µ¥¸ð : ¹æÀ§ ¼¾¼­(Compass)

  

3.2 ¾ÆÀÌÆù¿ë À¥¾Û ÇÁ·ÎÁ§Æ®

Xcode Æù°¸ Ç÷¯±×ÀÎ ¼³Ä¡

Æù°¸ ÇÁ·ÎÁ§Æ® »ý¼º

ÇÁ·ÎÁ§Æ®¿¡ www Æú´õ Ãß°¡

À¥ Åë½ÅÀ» À§ÇÑ È­ÀÌÆ®¸®½ºÆ® µî·Ï : PhoneGap.plist

À¥¾Û ¼Ò½º µî·Ï : jQuery Mobile Æù°¸ µ¥¸ð ¼Ò½º

°¡»ó±â±â¿¡¼­ ½ÇÇèÇϱâ

  

3.3 À©µµ¿ìÆù¿ë À¥¾Û ÇÁ·ÎÁ§Æ®

Visual Studio Æù°¸ ÅÛÇø´ ¼³Ä¡

Æù°¸ ÇÁ·ÎÁ§Æ® »ý¼º

°¡»ó±â±â¿¡¼­ ½ÇÇèÇϱâ

À¥¾Û ¼Ò½º µî·Ï : jQuery Mobile Æù°¸ µ¥¸ð ¼Ò½º

½Å±Ô ¼Ò½ºÀÇ Content ¼³Á¤

Viewport ±³Á¤

  

4Àå jQuery MobileÀÇ ±âÃÊ

  

4.1 jQuery MobileÀÇ ±âº» ±¸Á¶

ÇÁ·¹ÀÓ¿÷ÀÇ ÁÖ¿ä ÆÄÀϵé

¾ÆÀÌÄÜ ¶óÀ̺귯¸®ÀÇ ÀÛµ¿ ¿ø¸®

  

4.2 jQuery MobileÀÇ µðÀÚÀÎ ¼Ö·ç¼Ç µÑ·¯º¸±â

jQuery MobileÀ» Áö¿øÇÏ´Â Ç÷§Æû

°³¹ß¿ë HTML5 À¥ºê¶ó¿ìÀú

jQuery Mobile °ø½Ä ¸Å´º¾ó ¹× µ¥¸ð º¸±â

  

4.3 jQuery MobileÀÇ Æ¯Â¡ 


5
Àå ½º¸¶Æ® ÆäÀÌÁöÀÇ ±âº» ±¸¼º

  

5.1 ½º¸¶Æ® ÆäÀÌÁöÀÇ ±âº» Çü½Ä

5.2 ºäÆ÷Æ® ¼³Á¤

5.3 jQuery Mobile ÇÁ·¹ÀÓ¿÷ È£Ãâ

  

6Àå »ó´Ü Åø¹Ù : ¸Ó¸®¸» ¿µ¿ª 


6.1
±âº»Çü ¸Ó¸®¸» ¿µ¿ª

6.2 ¸Ó¸®¸» ¿µ¿ªÀÇ ¹öÆ° ÁÖ¹«¸£±â

¸Ó¸®¸» ¿µ¿ª ¹öÆ° 1°³ÀÏ ¶§¿Í ²¿¸®¸» ¿µ¿ªÀÇ ÇÏ´Ü °íÁ¤

¸Ó¸®¸» ¹öÆ° ¾ÆÀÌÄÜ

¸Ó¸®¸» ¿µ¿ª°ú ¹öÆ°¿¡ º°µµ Å׸¶ ¼³Á¤

1°³ÀÇ ¸Ó¸®¸» ¹öÆ° ¿À¸¥ÂÊ ¹èÄ¡

2°³ÀÇ ¸Ó¸®¸» ¹öÆ° ¾çÂÊ ³¡ ¹èÄ¡¿Í ¹öÆ° ¾ÆÀÌÄܸ¸ Ãâ·Â

¹é ¹öÆ° ¸µÅ© ó¸®

¸Ó¸®¸» ¿µ¿ªÀÇ ³»ºñ°ÔÀÌ¼Ç ¹Ù


7
Àå ÇÏ´Ü Åø¹Ù : ²¿¸®¸» ¿µ¿ª 


7.1
²¿¸®¸» ¿µ¿ª ±âº»Çü

7.2 ²¿¸®¸» ¿µ¿ªÀÇ ¹öÆ°µé

²¿¸®¸» ÀÏ¹Ý ¹öÆ°

²¿¸®¸» ±×·ì ¹öÆ°

7.3 ²¿¸®¸» ¿µ¿ªÀÇ ³»ºñ°ÔÀÌ¼Ç ¹Ù

7.4 ÆäÀÌÁö Ç® ½ºÅ©¸°°ú ²¿¸®¸» ¼û±è

7.5 ²¿¸®¸» ¿µ¿ªÀÇ ¼±Åà ¸Þ´º¿Í È­¸é Àüȯ È¿°ú

  

8Àå ½º¸¶Æ® ÆäÀÌÁö ·¹À̾ƿô 


8.1
½Ì±ÛÇü ÆäÀÌÁö

8.2 ¸ÖƼÇü ÆäÀÌÁö

8.3 ÀÚµ¿ ºÐÇÒÇü ÆäÀÌÁö : splitview Ç÷¯±×ÀÎ

À¥ºê¶ó¿ìÀú ½ÇÇè

¾ÆÀÌÆù ½ÇÇè

¾ÆÀÌÆÐµå ½ÇÇè

¾Èµå·ÎÀ̵åÆù ½ÇÇè

jQuery Mobile Splitview Ç÷¯±×ÀÎ ´Ù¿î·Îµå

¼Ò½º ºÐ¼®

 

9Àå ½º¸¶Æ® ÆäÀÌÁö ¸µÅ© 󸮹ý

  

9.1 Ajax ¸µÅ© ¹æ½Ä

¾ÞÄ¿(Anchor) ¸µÅ© ¹æ½Ä

·ÎÄà HTML ÆÄÀÏ ¸µÅ©

´ëÈ­»óÀÚ ¾ÞÄ¿ ¸µÅ© ¹æ½Ä

´ëÈ­»óÀÚ ÆÄÀÏ ¸µÅ© ¹æ½Ä

  

9.2 Ç® ÆäÀÌÁö(Full-Page) ¸µÅ© ¹æ½Ä : Ajax »ç¿ëÇÏÁö ¾ÊÀ½

¿ÜºÎ µµ¸ÞÀÎ ¸µÅ©

¿ÜºÎ HTML ÆÄÀÏ ¸µÅ©

target ¸µÅ©

return false ¸µÅ©

  

9.3 ¿ÜºÎ ÇÁ·Î±×·¥ ¸µÅ©

À̸ÞÀÏ ¸µÅ©

ÀüÈ­¹øÈ£ ¸µÅ©

SMS ¹®ÀÚ ¸µÅ©

Áöµµ ¸µÅ©

  

9.4 ¹é(Back) ¹öÆ° ¸µÅ©

9.5 »ùÇà ¼Ò½º ºÐ¼®

  

10Àå data-urlÀÇ ±â´É°ú Ư¼ºÀÇ ÀÌÇØ

  

10.1 ÆäÀÌÁö ¾ÆÀ̵𰡠ÀÖ´Â °æ¿ì

10.2 ÆäÀÌÁö ¾ÆÀ̵𰡠¾ø´Â °æ¿ì

10.3 data-url ¼Ó¼ºÀ» Æú´õ·Î Á¤ÀÇÇÏ´Â °æ¿ì

10.4 data-url ¼Ó¼ºÀ» ÆäÀÌÁö·Î Á¤ÀÇÇÏ´Â °æ¿ì

10.5 À¥¾Û¿¡¼­ÀÇ ½ÇÇè

¾Èµå·ÎÀÌµå ½ÇÇè

¾ÆÀÌÆù ½ÇÇè

  

11Àå È­¸é Àüȯ ¾Ö´Ï¸ÞÀ̼Ç

  

11.1 ±âº» È­¸é Àüȯ È¿°ú

È­¸é Àüȯ È¿°ú »ç¿ë¾ÈÇÔ : none

½½¶óÀ̵å : slide

½½¶óÀ̵å¾÷ : slideup

½½¶óÀ̵å´Ù¿î : slidedown

ÆË : pop

ÆäÀ̵å : fade

Çø³ : flip 250

ÅÏ : turn 251

Ç÷οì : flow 253

  

11.2 È­¸é Àüȯ È¿°ú ¿ª¼ø

11.3 °³¹ßÀÚ Á¤ÀÇ È­¸é Àüȯ È¿°ú

±âº» È­¸é Àüȯ È¿°ú

±âº» ´ëÈ­»óÀÚ Àüȯ È¿°ú

CSSÇü È­¸é Àüȯ È¿°ú

  

11.4 Àüü ¼Ò½º »ìÆ캸±â

11.5 À¥¾Û¿¡¼­ÀÇ Æ¯¼º

¾ÆÀÌÆù ½ÇÇè

¾Èµå·ÎÀÌµå ½ÇÇè

  

12Àå ½º¸¶Æ® ´ëÈ­»óÀÚ

  

12.1 ±âº» ´ëÈ­»óÀÚ

12.2 ´ëÈ­»óÀÚ Àüȯ È¿°ú

12.3 ´ëÈ­»óÀÚ Å׸¶ Àû¿ë

12.4 ´ëÈ­»óÀÚ ¿À¹ö·¹ÀÌ Å׸¶

  

12.5 ¸¶¹ý»çÇü ´ëÈ­»óÀÚ

¸¶¹ý»ç ÀÛ¼º ¿ø¸®

¸¶¹ý»ç ½ÇÇà ½ÇÇè

  

12.6 ¼±ÅÃÇü ´ëÈ­»óÀÚ

12.7 Àüü ¼Ò½º »ìÆ캸±â

12.8 À¥¾Û¿¡¼­ÀÇ Æ¯¼º

¾Èµå·ÎÀÌµå ½ÇÇè

¾ÆÀÌÆù ½ÇÇè

  

13Àå ½º¸¶Æ® ¹öÆ°

 

13.1 ¹öÆ° ¼Ó¼º

13.2 ¹öÆ° ±âº» ¾ÆÀÌÄÜ

13.3 ¹öÆ° ¾ÆÀÌÄÜÀÇ À§Ä¡

13.4 ±âº» ¹öÆ° ¾ÆÀÌÄÜ : ¾ÆÀÌÄܸ¸ Ãâ·Â°ú ±×·ì ¹öÆ°

13.5 ³ª¸¸ÀÇ ¹öÆ° ¾ÆÀÌÄÜ

13.6 ¹öÆ° ¸ð¾ç ºñ±³

13.7 ¸ñ·Ï ¹öÆ°°ú ±âº» È°¼º ¼³Á¤

13.8 Æû ¹öÆ°

13.9 ¹öÆ°°ú ÀÚ¹Ù½ºÅ©¸³Æ®

13.10 Àüü ¼Ò½º »ìÆ캸±â

13.11 À¥¾Û¿¡¼­ÀÇ Æ¯¼º

¾Èµå·ÎÀÌµå ½ÇÇè

¾ÆÀÌÆÐµå ½ÇÇè 


14
Àå ½º¸¶Æ® ÄÜÅÙÆ® ·¹À̾ƿô

 

14.1 HTML ±âº» ¸¶Å©¾÷ ½ºÅ¸ÀÏ

Çìµå ÅÂ±× ½ºÅ¸ÀÏ : <h>

<a>, <p>, <pre>, <span>, <div> ÅÂ±× ½ºÅ¸ÀÏ

¸ñ·ÏÇü ÅÂ±× ½ºÅ¸ÀÏ

Å×À̺íÇü ÅÂ±× ½ºÅ¸ÀÏ

»ùÇà ¼Ò½º »ìÆ캸±â

 

14.2 ±×¸®µå ·¹À̾ƿô

<div> ±×¸®µå

<fieldset> ±×¸®µå

´ÙÇà ±×¸®µå + height

´Ù¾çÇÑ ±×¸®µå Á¶ÇÕ + ui-bar ½ºÅ¸ÀÏ

±×¸®µå ¾ÈÀÇ ±×¸®µå »ó¼Ó

²¿¸®¸»¿¡ ±×¸®µå È°¿ë

»ùÇà ¼Ò½º »ìÆ캸±â

 

14.3 Á¢Æî½Ä ·¹À̾ƿô : Collapsible

Á¢Æî½Ä ±âº»Çü

±âº» Æîħ ¼³Á¤

¾ÆÀÌÄÜ À§Ä¡ ¼³Á¤

Å׸¶ ¼³Á¤ : ¸Ó¸®¸¸

Å׸¶ ¼³Á¤ : ¸Ó¸®¿Í ³»¿ë ¸ðµÎ

Å׸¶ ¼³Á¤ : ¸Ó¸®¿Í ³»¿ëÀ» ´Þ¸® ¼³Á¤

°èÃþÇü Á¢Æî½Ä

¾ÆÄÚµð¾ð ·¹À̾ƿô

»ùÇà ¼Ò½º »ìÆ캸±â

 

14.4 ¹Ùµð Å׸¶

¹Ùµð Å׸¶ ¼³Á¤

¹Ùµð Å׸¶ ¼³Á¤ »ç·Ê

»ùÇà ¼Ò½º »ìÆ캸±â

 

15Àå ½º¸¶Æ® Æû

 

15.1 ½º¸¶Æ® ÆûÀÇ ±âº» Çü½Ä

±âº»Çü, ¹Ì´ÏÇü, ³×ÀÌƼºêÇü ÆûÀÇ ±âº» Çü½Ä

¶óº§ ¼û±â±â

±×¸®µå ¹öÆ° ±×·ì

ÄÁÆ®·Ñ ±×·ì

Æû °´Ã¼ ºñÈ°¼ºÈ­

»ùÇà ¼Ò½º »ìÆ캸±â

 

15.2 ½º¸¶Æ® Æû °´Ã¼µé

½º¸¶Æ® ÀԷ»óÀÚ

½º¸¶Æ® üũ¹Ú½º

½º¸¶Æ® ¶óµð¿À ¹öÆ°

Ư¼ö ÀԷ»óÀÚ : °Ë»ö¾î(search), ·¹ÀÎÁö(range)

 

15.3 ½º¸¶Æ® ¼±ÅûóÀÚ

±âº»Çü ¼±Åà ¿É¼Ç

½º¸¶Æ®Çü ¼±Åà ¿É¼Ç

Ç÷¹À̽ºÈ¦´õ(placeholder) ¼±Åà ¿É¼Ç

±×·ìÇü ¼±Åà ¿É¼Ç

¼±ÅûóÀÚ ±×·ì ÄÁÆ®·Ñ°ú Å׸¶ Àû¿ë

Ư¼ö ¼±ÅûóÀÚ : ½½¶óÀÌ´õ(slider)

»ùÇà ¼Ò½º »ìÆ캸±â

 

16Àå ½º¸¶Æ® ¸®½ºÆ®

 

16.1 ±âº»Çü ¸ñ·Ï

16.2 ¹øÈ£ ¸ñ·Ï

16.3 °èÃþÇü ¸ñ·Ï°ú ÀбâÀü¿ë ¾ÆÀÌÅÛ

16.4 ±¸ºÐÀÚ ¸ñ·Ï

16.5 °Ç¼ö Ç¥½Ã

 

16.6 ¸ñ·Ï Å׸¶¿Í ¾ÆÀÌÅÛ ¾ÆÀÌÄÜ

¸ñ·Ï ±¸ºÐÀÚ, ¸ñ·Ï ¾ÆÀÌÅÛ, ¸ñ·Ï °Ç¼ö Å׸¶

¸ñ·Ï ¾ÆÀÌÅÛ Å׸¶

¸µÅ© ¾ÆÀÌÅÛ°ú ÀбâÀü¿ë ¾ÆÀÌÅÛÀÇ ½ºÅ¸ÀÏ ºñ±³

¸ñ·Ï ¾ÆÀÌÅÛÀÇ ¸µÅ© ¾ÆÀÌÄÜ º¯°æ

¸ñ·Ï ¾ÆÀÌÅÛ ¾ÆÀÌÄÜ ¸µÅ© ºÐ¸®

 

16.7 ¼¶³×ÀÏ°ú ¾ÆÀÌÄÜ À̹ÌÁö

16.8 ´Ù¾çÇÑ ¸ñ·Ï ¾ÆÀÌÅÛ Æ÷¸Ë

16.9 °Ë»ö ÇÊÅ͹Ù

16.10 »ùÇà ¼Ò½º »ìÆ캸±â

 

17Àå Å׸¶·Ñ·¯¿Í µðÀÚÀÎ ºô´õ

 

17.1 Å׸¶·Ñ·¯(ThemeRoller)

jQuery Mobile Å׸¶·Ñ·¯

 

17.2 ³ª¸¸ÀÇ Å׸¶ ¸¸µé±â

±âÁ¸ Å׸¶ °¡Á®¿À±â

±âº» Å׸¶ ¹Ì¸®º¸±â

½Å±Ô Å׸¶ Ãß°¡Çϱâ

³ª¸¸ÀÇ Å׸¶ ´Ù¿î¹Þ±â

³ª¸¸ÀÇ Å׸¶ »ùÇà ¼Ò½º ½ÇÇèÇϱâ

 

17.3 ½º¸¶Æ® µðÀÚÀÎ ºô´õ codiqa

jQuery MobileÀ» À§ÇÑ UI ºô´õ codiqa


17.4 codiqa
·Î µðÀÚÀÎÇϱâ

¸Ó¸®¸» ¿µ¿ª°ú ²¿¸®¸» ¿µ¿ª Ãß°¡Çϱâ

²¿¸®¸» ¿µ¿ª¿¡ ³»ºñ°ÔÀÌ¼Ç ¹Ù Ãß°¡Çϱâ

¸Ó¸®¸» ¿µ¿ª¿¡ ¹é ¹öÆ° Ãß°¡Çϱâ

³»¿ë ¿µ¿ª¿¡ ¹®ÀÚ¿­ Ãß°¡Çϱâ

³»¿ë ¿µ¿ª¿¡ À̹ÌÁö Ãß°¡Çϱâ

³»¿ë ¿µ¿ª¿¡ Á¢Æî½Ä ¸ñ·Ï Ãß°¡Çϱâ

³»¿ë ¿µ¿ª¿¡ ±×¸®µå Ãß°¡Çϱâ

³»¿ë ¿µ¿ª¿¡ ¸®½ºÆ®ºä Ãß°¡Çϱâ

³»¿ë ¿µ¿ª¿¡ Æû °´Ã¼ Ãß°¡Çϱâ

HTML ¼Ò½º ´Ù¿î¹Þ°í ½ÇÇèÇϱâ

 

18Àå jQuery MobileÀÇ ±âº» ȯ°æ ¼³Á¤

 

18.1 mobileinit À̺¥Æ®

18.2 ±âº» ȯ°æ ¼³Á¤ ¿É¼Çµé

 

19Àå jQuery Mobile À̺¥Æ® ÀÛ¼º¹ý

 

19.1 bind() ¸Þ¼Òµå

19.2 live() ¸Þ¼Òµå

19.3 bind()¿Í live(), delegate(), on() ¸Þ¼ÒµåÀÇ ÅëÇÕ¼º

19.4 on()°ú off() ¸Þ¼Òµå

19.5 ÆäÀÌÁö À̺¥Æ®µé

 

19.6 ÆäÀÌÁö ·Îµå À̺¥Æ®

pagebeforeload À̺¥Æ®

pageload À̺¥Æ®

pageloadfailed À̺¥Æ®

 

19.7 ÆäÀÌÁö º¯°æ À̺¥Æ®

pagebeforechange À̺¥Æ®

pagechange À̺¥Æ®

pagechangefailed À̺¥Æ®

 

19.8 ÆäÀÌÁö Àüȯ À̺¥Æ®

pagebeforehide À̺¥Æ®

pagehide À̺¥Æ®

pagebeforeshow À̺¥Æ®

pageshow À̺¥Æ®

 

19.9 ÆäÀÌÁö ÃʱâÈ­ À̺¥Æ®

pagebeforecreate À̺¥Æ®

pagecreate À̺¥Æ®

pageinit À̺¥Æ®

 

19.10 ÆäÀÌÁö ºñÈ°¼º À̺¥Æ®

pageremove À̺¥Æ®

 

20Àå $.mobile °´Ã¼

 

20.1 ÆäÀÌÁö °ü·Ã ¸Þ¼Òµå¿Í ¼Ó¼º

$.mobile.changePage() ¸Þ¼Òµå

$.mobile.loadPage() ¸Þ¼Òµå

$.mobile.showPageLoadingMsg() ¸Þ¼Òµå

$.mobile.hidePageLoadingMsg() ¸Þ¼Òµå

$.mobile.activePage ¼Ó¼º

 

20.2 °íÁ¤ Åø¹Ù °ü·Ã ¸Þ¼Òµå

$.mobile.fixedToolbars.show() ¸Þ¼Òµå

$.mobile.fixedToolbars.hide() ¸Þ¼Òµå

 

20.3 °æ·Î °ü·Ã ¸Þ¼Òµå

$.mobile.path.parseUrl() ¸Þ¼Òµå

$.mobile.path.makePathAbsolute() ¸Þ¼Òµå

$.mobile.path.makeUrlAbsolute() ¸Þ¼Òµå

$.mobile.path.isSameDomain() ¸Þ¼Òµå

$.mobile.path.isRelativeUrl() ¸Þ¼Òµå

$.mobile.path.isAbsoluteUrl() ¸Þ¼Òµå

$.mobile.base ¼Ó¼º

 

20.4 ½ºÅ©·Ñ °ü·Ã ¸Þ¼Òµå

$.mobile.silentScroll() ¸Þ¼Òµå

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

ȸ»ç¼Ò°³