YUI 入門 - Web 前端程式開發實務

Transcript

1. Copyright © 2012 FITPI. All rights reserved. :6*
   -JCSBSZ 1 భ؊۽ӱῘứℯ↩⇪‣
    ᾣ℩ğᾠקდ
   
   KPTFQIK
2. Copyright © 2012 FITPI. All rights reserved. 8IZ
   :6* ๏ Ḳᇹਔࢳ
   +BWB4DSJQUb ๏ ၂ᇁ֥໾ࡱẹཟࠎẒb ๏ ሱị൙ࡱࢺ૫b ๏ ປᆜ
   4PGUXBSF
   4UBDLTb ๏ ଆ⊾∻
   -PBEFS
   ࡏἧb ๏ ∻
   /PEFKT
   ᆜކb ๏ ٤ഠಕaႵ܄ඳ⊷ჷῘứ۵௖⊑ܵ৘b 2
3. Copyright © 2012 FITPI. All rights reserved. 8IZ
   OPU
   :6* ๏ ᆩ଀؇۵௴ࠣੱᾱҵb ๏ ∽مᾱ♶≗a҂ᆰῒa⁽ᾒᾱۚb ๏ ∻
   :BIPP
   ႵἬ‗b 3
4. Copyright © 2012 FITPI. All rights reserved. 4 ᆜⅴῲ䪌
   :6*
   ิ܂ਔↀộῘứ֥ᇗေࠎẒ
   ໾ࡱẹཟaଆ⊾߄a-PBEFSaሱị൙ࡱ֩ Ớӱൔ֥၂ᇁྟa῭ԉḲᇹ٤ӈն ۞׭ࡏἧᆭᗥđႨ಩ޅỌ༆׻὜б⦁ದႵ
   4FOTF
5. Copyright © 2012 FITPI. All rights reserved. :6*
   ֥ࡏἧ ଆ⊾
   
   ≘ೆఖ 5
6. Copyright © 2012 FITPI. All rights reserved. ଆ⊾߄
   .PEVMBSJ[BUJPO ᾞۿିٳ⁽⦁ aေႨ֥ℭީ็⇢⊾ކ http://www.flickr.com/photos/bdesham/2432400623 6
7. Copyright © 2012 FITPI. All rights reserved. /"4"
   Ἵό෾ॢᅟ Ԣਔ ۚὩଡaἽό෾ॢᅟ္൞ଆ⊾߄֥ݺữ২ http://www.flickr.com/photos/nasamarshall/4546245011/ 7
8. Copyright © 2012 FITPI. All rights reserved. Ⴎ
   
   ἠ҂๝Ἵࡅ෮ิ܂֥
   
   ؟ἠଆ⊾ http://astronomy.wikia.com/wiki/ International_Space_Station /"4"
   Ἵό෾ॢᅟ 8
9. Copyright © 2012 FITPI. All rights reserved. Ήُࡹ⊤aݴ෾aὨྀa႗ⅴ֞ℂⅴ ᄝ಩ޅٳ۽ࣚ↱֥۽ӱ‴თ ଆ⊾߄Ῐứ൞сಖ⃮Ⅎ w㍇Ⴈ࠻Ⴕଆ⊾aх૧ᇗྍյᄯ⁛ሰx 9 ଆ⊾߄֥ݺẕ
10. Copyright © 2012 FITPI. All rights reserved. <script src="jquery-1.7.2.js"></script> <script src="jquery.ui.core.js"></script> <script src="jquery.ui.widget.js"></script> <script src="jquery.ui.accordion.js"></script> 
    ނྏݦൔῠ 
    ଆ⊾
     
    ଆ⊾
     
    ଆ⊾
     Ῐứཬ↌ᅟ≾∄ቓ㢻↜ⅳđ֌഍ັ♶≗֥ࣼ҂ℳކਔ ಆთṉ⅂a→Ὂྟaభᗥⅆ྽aଆ⊾ིੱ↜ⅳ 10 ቋࠎЧ֥
    +4
    ଆ⊾߄
11. Copyright © 2012 FITPI. All rights reserved. ằῒ֤ӱൔ෾؟aླᇗ♶൐Ⴈđ్ٳଆ⊾὜൞ޓϿ֥ቔم Ớᧄ൐Ⴈᆀῲ䪌a҂Ⴈ㬪ਔ၂ἠཬۿିϜ၂ؐỌ༆ঘ࣍ῲ ෮Ⴕ
    :6*
    ଆ⊾ẵσࢥс⇜ၛ≾∄֥ٚൔЇڭğ YUI.add("໛૊໊᜝", function (Y) { }, requires:["ॴध໛૊ 1", "ॴध໛૊ 2"]); // ্ํతჩᏐ Y ୅දྃ YUI త Instance function Editor() { // ഝੋ෺݅తݐߏࣜ } // ሡݐߏࣜఏঢ౸ Global Y.Editor = Editor; editor editor.js Why callback? ٢֞∉૫ഈℭ҂὜৫ࠧ⊋ྛa ֩֞ေႨℭᄜ⊋ྛࠧॖbݺẕ ൞ቓӱൔ֥ۯ a҂ᄜླေ ẕ৘ૄἠଆ⊾ᾇ֥༵ᗥⅆ྽b 11 :6*
    ଆ⊾ࡏἧ
12. Copyright © 2012 FITPI. All rights reserved. Ớ൐Ⴈᆀῲ䪌aᆺླᆷקଆ⊾଀Ẁࠧॖ൐Ⴈ YUI().use("editor", function (Y) { }); var editor = new Y.Editor(); // ࠑ Callback ୅දॴध໛૊օቮࡌೖ׬੒ // 㟬बՄҎ௚઀ݐཱ Y.Editor తྫ߲ 12 ൐Ⴈ
    :6*
    ଆ⊾
13. Copyright © 2012 FITPI. All rights reserved. // AMD Module define(function () { function Editor { /* Constructor */ } return Editor; }); require(["editor"], function (Editor) { new Editor(); }); // YUI Module YUI.add("editor", function () { function Editor { /* Constructor */ } Y.Editor = Editor; }); YUI.use("editor", function (Y) { new Y.Editor(); }); 13 ః෰⇢≢
    
    3FRVJSF+4 ଢభԢਔ
    :6*đഉໃႵః෰ݦൔῠ⤨ࡹଆ⊾߄ ֌
    3FRVJSF+4
    ॖၛቓ֞wạਬῘ൓x ۀ୑έެ၂∄đ֌
    :6*
    ၘῂႵỽڶ֥ଆ⊾ 3FRVJSF+4
    ≣ᆺ൞ἠࡏἧđ୆ေሱ࠭Ϝଆ⊾ࡆΆಀ
14. Copyright © 2012 FITPI. All rights reserved. 14 ྍ൭ն؟ᆺေἌ≡wႨxଆ⊾ࠧॖ ླնࡅ৘ࢳwଆ⊾൞
    :6*
    ֥ቋཬẪ໊x ေႨ಩ޅۿିđ୆с⇜ᆩ֡ଆ⊾֥଀Ẁğ ၂ἠଆ⊾๙ӈࣼ൞၂ἠẵσ ෮ၛଆ⊾߄֥ಌề൞
    ẵσ὜ṉ؟Ć Мᗥ္ླေႵὨᇅࢳ㢯
    3FRVFTU
    ⅂ਈ֥↜ⅳ ଆ⊾଀Ẁ∻≘ೆ http://yuilibrary.com/yui/docs/yui/modules.html :6*
    ֥෮Ⴕଆ⊾ਙі
15. Copyright © 2012 FITPI. All rights reserved. 15 ‣↮ğ:6*
    ଆ⊾ http://f2eclass.com/lab/yui/module.html ๏ ၘῂթᄝ၂ἠ
    DMBTT
    ଆ⊾đ⤨Ⴕ
    :$MBTT
    ࢺℚࠎЧ⊷⇫ࠣ
    HFU4UVEFOUT
    ֥ݦൔb ๏ ⃪০Ⴈ
    :6*BEE
    ྍᄹ၂ἠ
    GJUQJ
    ଆ⊾
    đ䥰૫ླק∕⇥ള଀Ẁਙі
    :$MBTTTUVEFOUT
    ❣ᆷקཌྷ၇ଆ⊾b ๏ ቋᗥ
    :6* VTF
    ᆷק
    GJUQJ
    ❣ޫࢡ
    :$MBTTHFU4UVEFOUT
    ݦൔb 
    ྍᄹ၂ἠ
    :6*
    ଆ⊾ YUI.add("ଆ⊾଀Ẁ", function () {
    
    
    
    
    
    ଆ⊾⤨ಸ },"ሱקϱὂ", {requires:["ཌྷ၇ଆ⊾"]});
16. Ⴕིੱֹ≘ೆ෮ླေ֥֥
    $44
    ∻
    +BWB4DSJQU
    ẵσ http://www.flickr.com/photos/bdesham/2432400623 16 ≘ೆఖ
    -PBEFS
17. Copyright © 2012 FITPI. All rights reserved. http://www.flickr.com/photos/halfbisqued/2353845688/ ᄝԚ௹a෮ླ֥
    +4
    ∻
    $44
    ׻ޓཬ <script src="http://code.jquery.com/jquery-1.4.2.min.js"></script> 可做很多事！ jQuery - 32K 17 ཬ↌∉҂ླॉ⁒≘ೆ↜ⅳ
18. Copyright © 2012 FITPI. All rights reserved. http://www.nipic.com/show/2/55/d96dde66860c5190.html ฿ଧĆ໡ἐೂޅẕ৘ ≾喁؟֥
    $44
    
    +4
    ẵσĤ ứᅚ֞၂קἲଆđἐೂޅ⇢≢ૄ∉෮ླ֥ẵσ଻ ଆ⊾߄὜్ٳԛޓ؟ẵσđೂޅܵ৘ࠣ≘ೆ൞၂⁽⇥↜ 18 ↌ᅟсླॉ⁒≘ೆٚൔ
19. Copyright © 2012 FITPI. All rights reserved. 19 ᾱ҂⊦∊֥↌ᅟᄝ૫Ớ≾∄֥↜ⅳ ׻൞ẛ൭۽၂∉၂∉⇔aࠇᆀ൞յӮ၂նЇ ֤ॉ⁒༵ᗥⅆ྽a→Ὂྟ֮a္↥مቋࡄ߄ ᾱҵ֥≘ೆٚൔ ིିࠣ→Ὂྟ↜ⅳ
20. Copyright © 2012 FITPI. All rights reserved. http://www.flickr.com/photos/billjacobus1/123644872/ :6*
    ֥
    -PBEFS
    Ὠᇅ ⇐ᇹ≘ೆਬ೛౏؟֥ଆ⊾ẵσ 20 :6*
    ⤨ࡹ≘ೆὨᇅ
21. Copyright © 2012 FITPI. All rights reserved. ၛ
    :6*
    %BUB5BCMF
    㬪ữ২
    EBUBUBCMF
    ଆ⊾ ҂
    SFMPBE
    ֥ྛ㬪ޓ؟ğ㍤ ∉aஆ྽aᆰࢤṇὰb္ॖ ၛႵ۲⊕⊷ਘῲჷđ൞ἠޓ ♶≗֥ଆ⊾b 21 :6*
    ଆ⊾≘ೆὨᇅ
22. Copyright © 2012 FITPI. All rights reserved. ᆺေέྛӱൔࣼॖၛ≘ೆ෮ླଆ⊾ <script src="http://yui.yahooapis.com/3.7.3/build/yui/yui-min.js"></script> <script> </script> YUI().use("datatable", function (Y) { }); ିམཞ
    
    ྛӱൔМᗥaቓਔ؟ഒ൙
    alert(Y.DataTable); 22 :6*
    ଆ⊾≘ೆὨᇅ
23. Copyright © 2012 FITPI. All rights reserved. escape yui (Seed) widget datatable-core base-build datatable-head datatable-body model-list node-event-delegate base-base attribute event-focus base-plugin-host node-base node-style classnamemanager view yui-base event-delegate pluginhost event-synthetic attribute-core attribute-events attribute-extras array-extras array-invoke arraylist json-parse model YUI().use('datatable') 23 ίෘཌྷ၇ଆ⊾֥Ἶӱ
24. Copyright © 2012 FITPI. All rights reserved. ルն֥⇭⅜Ὠ భ၂∉ᆺਙԛਔ
    
    ἠଆ⊾đ֌ℯόഈ὜Ⴕ
    
    ἠ 
    ἠଆ⊾ࣼսіਔ
    
    ἠẵσa
    ୆ॖି὜ῒ֤ޓῢ≵ ֌ଆ⊾߄ࣼ൞ေϜ҂ཌྷۄ֥ӱൔԎ a᾽ॖିࣚᾏ :6*
    ֥
    $PNCP
    )BOEMFS
    ॖϜ⅂ਈ֥↜ⅳṼָࢳ㢯 http://yui.yahooapis.com/combo? <໛૊1త䈕Ҋ࿏ኸ>& <໛૊2త䈕Ҋ࿏ኸ>& ... YUI().use('datatable') 24 $PNCP
    )BOEMFS
25. Copyright © 2012 FITPI. All rights reserved. ᾞ෮ླ
    :6*
    ଆ⊾ٳ೛Ӯ
    
    ἠ⃪౰a௜ྛ༯≘ ୆෮ႄႨ֥
    :6*
    ⊕ሰẵ ༵≘ೆཌྷἬ
    $44
    ٳ೛֥⁣ὰğwẵσ⊺⅂ਈxaw⏟´ఖ๝ℭ⃪౰⅂ਈxaw⏟´ఖ
    (&5
    ṵ؇֥ཋᇅx YUI().use('datatable') 25 ӑሱọ߄֥௜ྛ≘ೆὨᇅ
26. Copyright © 2012 FITPI. All rights reserved. ạ⊕ሰṉӮն⅀ᆺ޽ਔ
    
    NT 323ms ൞၂ॐປಆ㢻Ⴕ⊱ಽ֥ն⅀aၹ
    .PEVMF
    ్֥ٳ٤ӈ֥↱aႨ҂֥֞䌉҂≘ೆ YUI().use('datatable') 26 :6*
    ≘ೆིି
27. Copyright © 2012 FITPI. All rights reserved. John Resig The creator of jQuery YUI().use() + pulling code off of Yahoo's CDN is damn sexy and should be promoted *VERY* heavily. http://www.quora.com/How-could-YUI3-improve-its-image-compared-to- jQuery-MooTools-etc :6*
    ሱọ≘ೆݦൔῠ֥ٚൔℯᄝ ෾
    4FYZ
    ਔa∣ἐФն৯๷ἱ 27 ’
    K2VFSZ
    ቔᆀ׻䪌
28. Copyright © 2012 FITPI. All rights reserved. ‣↮ğ-PBEFS 28 http://f2eclass.com/lab/yui/loader.html <script type="text/javascript" src="http://yui.yahooapis.com/3.7.3/build/yui/yui-min.js"></script> <script> YUI().use("datatable", function (Y) { Y.log(Y.DataTable); alert("ቮៃࡌೖ datatable ໛૊"); }); </script>
    
    
    ≾ἠ‣↮ᆺေο
    'a⇢౼
    /FUXPSL
    ↌ਫ਼
    Ἥु
    :6*
    ֥
    SFRVFTU
    ࠧॖ
29. Copyright © 2012 FITPI. All rights reserved. 29 :6*
    ܲ↌ࢺℚ http://yuilibrary.com
30. Copyright © 2012 FITPI. All rights reserved. 30 ๏ 2VJDL
    4UBSU ྍ൭ഈਫ਼ ๏ 6TFS
    (VJEFT
    ٳ⁽⦁ ਙԛ
    :6*
    ܲٚ෮Ⴕ⤨ಸ ๏ (FUUJOH
    4UBSUFE
    ⊀Ớ၂ἠଆ⊾֥ࢺℚ ๏ "1*
    %PDVNFOUBUJPO
    ਙԛ၂ἠଆ⊾֥෮Ⴕℾྟaٚمa൙ࡱ ๏ .PEVMF
    նᇁਔࢳଆ⊾֥ٳم IUUQZVJMJCSBSZDPNZVJEPDTZVJNPEVMFTIUNM :6*
    ܲ↌ࢺℚ
31. Copyright © 2012 FITPI. All rights reserved. 31 جຊ DOM Event ແհ໘త JS ޭೳ ༗հ໘త JS ߇੍߲ ݩ݅Սߏ 6TFS
    (VJEFT ਙԛ
    :6*
    ෮Їݣ֥෮ႵỌ༆ CSS ޻۩ ଌࢼٴআࡨ޻۩
32. Copyright © 2012 FITPI. All rights reserved. 32 :6*
    $PSF Ⴈ
    :6*
    ẕ৘
    +BWB4DSJQU
    ֥
    %0.
    ∻
    &WFOU
33. Copyright © 2012 FITPI. All rights reserved. 33 <script src="http://yui.yahooapis.com/3.7.3/build/yui/yui-min.js"></script> <script> </script> YUI().use("node", "event", function (Y) { }); :6*
    ൐Ⴈٚൔ ࡹ∗٢ᇂ໊ᇂğCPEZ
    భ ଆ⊾
    ଆ⊾
    ଆ⊾
    ଆ⊾O ଆ⊾≘ೆປṂ෮⊋ྛ֥ݦൔ Ⴕ
    :6*
    ֥
    *OTUBODF
    ॖႨ
34. Copyright © 2012 FITPI. All rights reserved. 34 OPEF
    
    թ౼ᾳề <div id="article"> <h1>৽ళࢢ޷٣త࢏ኗ</h1> <ul class="restaurant"> <li>ՄѪଜศᙛɿ୆๺០৽ళࢢେᩕ֗8ᥒ</li> <li>Ѩًݱᖱ㐋ڇ೑ɿ୆๺០৽ళࢢதڵ࿏ࡾஈ225ᥒ</li> <li>∍ਓڇ೑ṵɿ୆๺០৽ళࢢதڵ࿏ࡾஈ176ᥒ</li> <li>ોߌɿ୆๺០৽ళࢢຽᒟ࿏25ᥒ2F</li> <li>ԦՈแࢠɿ୆๺០৽ళࢢᅳߍ࿏25ᥒ೭1</li> <li>᫤ɻ࢛઒੒౎খᖱɿ୆๺០৽ళࢢ٢҆࿏2-1ᥒ</li> <li>ࢁ౦ᰤࢠؗɿ୆๺០৽ళࢢதԝ࿏133޽19ᥒ1ᒭ</li> <li>ᒜಃવ݈߁খՐುɿ୆๺០৽ళࢢதԝޒ֗2ᥒ</li> <li>࿡࿡Րುɿ୆๺០৽ళࢢதԝ࿏89ᥒ</li> <li>ཾ໳٬ᑣɿ୆๺០৽ళࢢதԝ࿏98ᥒ೭1</li> <li>ṵሣṵɿ୆๺០৽ళࢢதԝ࿏33ᥒ</li> </ul> </div> ๏ ౼֤၂ἠ
    SFTUBVSBOU
    ᾳề var node = Y.one(".restaurant"); ๏ ౼֤෮Ⴕ
    MJ var nodes = Y.all("li"); ๏ ౼ֻ֤
    
    ἠ
    MJ var nodes = Y.one("li:nth-child(5)"); Ⴈ
    $44
    ⇢౼ఖ౼֤ᾳề ౼֤֥ᾳềॖၛᄜಀ౼ᾳề ๏ ౼֤၂ἠ
    BSUJDMF
    ᾳề var node = Y.one("#article"); ๏ ౼֤
    BSUJDMF
    ༯૫֥෮Ⴕ
    MJ
    ᾳề var itemNodes = node.all("li"); ࿅श - http://f2eclass.com/lab/yui/node.html Y.all(); Y.one();
35. Copyright © 2012 FITPI. All rights reserved. OPEF
    
    թ౼ᾳề ๏ HFU
    
    TFU
    ౼֤
    
    ℟קℾྟ ๏ BEE$MBTT
    
    SFQMBDF$MBTT
    
    SFNPWF$MBTT
    
    UPHHMF$MBTT ๏ HFU)5.-
    
    TFU)5.-
    ౼֤
    
    ۷ྍ⤨ಸ ๏ HFU4UZMF
    
    TFU4UZMF
    ౼֤
    
    ℟ק∄ൔ ๏ BODFTUPS
    ౼֤ଛᾳề ๏ BQQFOE
    
    SFNPWF
    ྍᄹሰᾳề
    
    ⦄Ԣᾳề ๏ ۷؟ࢺℚğIUUQZVJMJCSBSZDPNZVJEPDTOPEF 35 ࿅श - http://f2eclass.com/lab/yui/node2.html
36. Copyright © 2012 FITPI. All rights reserved. FWFOU
    
    ḳק൙ࡱ ๏ PO ൙ࡱ଀Ẁ
    ẕ৘ݦൔ ๏ FTUPQ1SPQBHBUJPO
    ๔ᆸ⃊ஞ൙ࡱ ๏ FQSFWFOU%FGBVMU
    ๔ᆸ≁℟ྛ㬪 ๏ EFMFHBUF
    ຾಩ ๏ GJSF
    Ẕứሱị൙ࡱ ๏ ۷؟ࢺℚğIUUQZVJMJCSBSZDPNZVJEPDTFWFOU 36
37. Copyright © 2012 FITPI. All rights reserved. ‣↮ğOPEFFWFOU 37 c০Ⴈ
    :EFMFHBUF
    ḳ൙ࡱ c:EFMFHBUF DMJDL
    ݦൔ
    ⇢≢ఖ  cềὧ߁ඊϜ
    MJ
    ṉӮ喆೤ cOPEFBEE$MBTT IJHIMJHIU  c⅄ᇗềὧ
    ECMDMJDL
    Ϝ
    MJ
    ἡ⦄Ԣ
    cOPEFSFNPWF  c⦄ԢປṂẔứ၂ἠ൙ࡱ
    c:GJSF EFMFUFE
    Ҕⅸ଀Ẁ  http://f2eclass.com/lab/yui/node-event.html
38. Copyright © 2012 FITPI. All rights reserved. 38 :6*
    "OJN ọ὎
39. Copyright © 2012 FITPI. All rights reserved. 39 ๏ WBS
    BOJN
    
    OFX
    :"OJN ℟ק໾ࡱ  ๏ ℾྟ
    GSPN
    0CKFDU
    
    ọ὎Ῐ൓ℭ ๏ ℾྟ
    UP
    0CKFDU 
    ọ὎᾵ඏℭ ๏ ℾྟ
    EVSBUJPO
    /VNCFS
    
    ⊺܋૰⅂ ๏ ℾྟ
    FBTJOH
    4USJOH
    
    ིݔ ๏ ݦൔ
    BOJNSVO  ๏ ൙ࡱ
    FOE ‣↮ğ:"OJN http://f2eclass.com/lab/yui/anim.html
40. Copyright © 2012 FITPI. All rights reserved. "+"9
    
    8FC
    
    ֥ࠎẒ 40 :6*
    *0
41. Copyright © 2012 FITPI. All rights reserved. ẖⅼ↌∉۷ྍٚൔ 㑌Ұ࣍౎ੋ੔ทॏ৽੔ཧɼୠՄೳ୞धখ෦෼ߋ৽ ࢖༻ऀᖣ᧸ث A ໢᜾ 1. ᚙग़ Request A ໢᜾ ࢕෰ث 2. ࢕෰ث႔ཧ Request 3. ࢕෰ثճၚ 4. ੔㟨໢ทॏ৽੔ཧ ၚ౷ྲྀఔɿ 41
42. Copyright © 2012 FITPI. All rights reserved. ࢖༻ऀᖣ᧸ث A ໢᜾ 1. ༻ JavaScript ᚙग़ Request A ໢᜾ ࢕෰ث 2. ࢕෰ث႔ཧ Request 3. ࢕෰ثճၚ 4. ୞༗খ෦෼ߋ৽ AJAXྲྀఔɿ 42 "+"9
    ↌∉۷ྍٚൔ ୞ኺ࢕෰ث্ࡌೖॴཁߋ৽తࢿྉɺࣕඇ੔ท
43. Copyright © 2012 FITPI. All rights reserved. ‣↮ğ:JP 43 ๏ ٢ᄝයڛఖ؊๝၂ἠଢ仛༯֥ẵσğ IUUQGFDMBTTDPNMBCZVJJPUYU ๏ ứԛ⃪౰ğ
    :JP VSM 
    ๏ යڛఖ߭∣ğ:PO JPDPNQMFUF
    GVODUJPO
    JE
    P
    \^ 
    ๏ ۷ᾏẪ֥ቔمğ/PEFMPBE VSM 
    ࠧॖᾞ⊷ਘೖೆᾳềᇏb ๏ ۷؟⊷ਘğIUUQZVJMJCSBSZDPNZVJEPDTJP http://f2eclass.com/lab/yui/io.html
44. Copyright © 2012 FITPI. All rights reserved. ଘऔލ໢Ҭతࢿྉ 44 Y.JSONP ⊷ਘթ౼Ⴕἠࢡ
    4BNF
    0SJHJO
    1PMJDZ
    ֥ཋᇅ +BWB4DSJQU
    ൞҂ିթ౼ଢభ↌თၛຓ֥⊷ਘ֥ +40/1
    ൞০Ⴈ
    +4
    ॖФॴთళೆ֥หྟطℯቔ֥
45. Copyright © 2012 FITPI. All rights reserved. 45 ӈႨᧄ↌ᅟ⊷ਘࢌ㍤ ᅳ҂֞
    +40/
46. Copyright © 2012 FITPI. All rights reserved. http://api.flickr.com/services/feeds/photos_public.gne? tags=f2e&lang=en-us&format=json&jsoncallback=getData <script src=" "></script> 46 +40/1
    ࣼ൞ຓ҆
    +4 ڿ㬪
    +40/ ℟קݦൔ଀Ẁ
47. Copyright © 2012 FITPI. All rights reserved. 47 ‣↮ğ:KTPOQ ๏ ‣↮↌ᆶğ IUUQGFDMBTTDPNMBCZVJKTPOQIUNM ๏ ০Ⴈ
    'MJDLS
    ิ܂֥
    "1*
    ࢺ૫ ❖ IUUQXXXGMJDLSDPNQIPUPTUBHTἬᾗሳ ❖ IUUQBQJGMJDLSDPNTFSWJDFTGFFETQIPUPT@QVCMJDHOF UBHTἬᾗሳMBOHFO VTGPSNBUKTPOKTPODBMMCBDL\DBMMCBDL^ ๏ :KTPOQ 63-
    ߭ẖݦൔ  ๏ ᄝ߭ẖݦൔᇏϜ෮ླ
    )5.-
    ⊾ԛῲ ๏ ۷؟⊷ਘğIUUQZVJMJCSBSZDPNZVJEPDTKTPOQ ౼֤ॴ↌თ⊷ਘ
48. Copyright © 2012 FITPI. All rights reserved. ᾞ
    )5.-
    ֥⊾ކạ
    +BWB4DSJQU
    ᇏٳ ԛῲ 48 Y.Handlebars +40/1
    ֥ữ২ᇏ໡ⁿс⇜ᄝ
    +4
    ᇏ⊾ކ
    )5.- ൅ٳ֥҂ݺ⇔đ္҂ژކ↌∉Ṍ⊵߄֥ࣚപ )BOEMFCBST
    ൞⊦⁽ࢳ㢯Վ↜ⅳ֥∄ϰ༢ⅼ
49. Copyright © 2012 FITPI. All rights reserved. ‣↮ğ:)BOEMFCBST 49 ๏ ‣↮↌ᆶğ IUUQGFDMBTTDPNMBCZVJIBOEMFCBSTIUNM ๏ :6* VTF IBOEMFCBST  ๏ ∄ϰğ
    TDSJQU
    UZQFUFYUYIBOEMFCBSTUFNQMBUFTDSJQU ๏ ṇ∙ğUFNQMBUF
    
    :)BOEMFCBSTDPNQJMF )5.-  ๏ ℻ԛğUFNQMBUF EBUB  ๏ ۷؟ğIUUQZVJMJCSBSZDPNZVJEPDTIBOEMFCBST
50. Copyright © 2012 FITPI. All rights reserved. 8FC
    
    ֥wῘྍℶԳx 50 :6*
    1BOFM Ἶಀ໡ⁿႨ
    XJOEPXPQFO
    ῘཬℶԳ ֌⇀ᄝ׻൞ᆰࢤῘ၂ṧ
    EJW
    ᆰࢤڜᄝ∉૫ഈ
51. Copyright © 2012 FITPI. All rights reserved. :6*
    ℶԳ 51
52. Copyright © 2012 FITPI. All rights reserved. http://f2eclass.com/lab/yui/panel.html ‣↮ğ:6*
    1BOFM 52 ๏ CPEZ
    ᄹࡆ
    ZVJTLJOTBN
    ֥
    DMBTT ๏ ᆷק
    :6* VTF
    ֥ଆ⊾㬪
    QBOFM ๏ OFX
    :1BOFM ℾྟᆴ 
53. Copyright © 2012 FITPI. All rights reserved. DFOUFSFE ൞ڎေᇂᇏỚ⃆ NPEBM ൞ڎ㬪Ồ⟬ଆൔ WJTJCMF ≁℟൞ڎ↾ൕ XJEUI ℶԳ֥ῥ؇ IFJHIU ℶԳ֥ۚ؇ 1BOFM
    ෮ิ܂֥ℾྟ 53
54. Copyright © 2012 FITPI. All rights reserved. ῜ӱ߭Ἢ 54 ๏ :6*
    ֥∱ಌềaࠣ෱֥֥ࡏἧğଆ⊾߄a ≘ೆఖa໾ࡱẹཟῘứ
    Άᾲᄜิ ๏ :6*
    ֥ܲ↌ೂޅ൐Ⴈb ๏ :6*
    ֥ނྏݦൔῠğ/PEF
    ∻
    &WFOUđṘ ቀਔ⏟´ఖ֥҂ቀb ๏ :6*
    ֥ݦൔῠ۽ऎa॥ᇅ⇊ἐೂޅ൐Ⴈb
55. Copyright © 2012 FITPI. All rights reserved. 55 Q & A