YUI
Yahoo! User Interface Library




                   A presentation by
contents



   I.   w is YUI?
         hat
   II. w does it all m
        hat           ean?
   III. w does it look like?
...
w is YUI?
 hat


  a collection of JavaScript and CSS Resources for
     building richly interactive w applications
      ...
w is YUI?
 hat


  features of YUI
    6 types of YUI components:

            core
            utilities
            UI c...
w does it all m
 hat           ean?


 features of YUI (continued)
     core:
     a set of tools for event managem and DO...
w does it all m
 hat           ean?


 features of YUI (continued)
    utilities:
    reusable infrastructure libraries th...
w does it all m
 hat           ean?


 features of YUI (continued)
    UI controls:
    • auto -c o mple te   •imag e c ro...
w does it all m
 hat           ean?


 features of YUI (continued)
    developer tools:
    lo g g e r –read or w log m
  ...
w does it look like?
 hat


 working examples:
    e ve nt utility -
    http://developer.yahoo.com/yui/examples/event/eve...
w uses YUI?
 ho


     http ://www .linke din .c o m /
     http ://www .je tblue .c o m /
     http ://www .targ e t.c o ...
w to get som
 ant        e?




  hello@momentumdesignlab.com


           1.866.542.7124



                      A prese...
Upcoming SlideShare
Loading in …5
×

Y U I(2)

594 views

Published on

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
594
On SlideShare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Y U I(2)

  1. 1. YUI Yahoo! User Interface Library A presentation by
  2. 2. contents I. w is YUI? hat II. w does it all m hat ean? III. w does it look like? hat IV. w uses YUI? ho V. w to get som ant e? A presentation by
  3. 3. w is YUI? hat a collection of JavaScript and CSS Resources for building richly interactive w applications eb using DOM scripting and DHTM and AJAX. L developed for internal use but nowavailable under a BSD (Berkeley Software Distribution) license. supported by Firefox 3, Firefox 2, IE 7, IE 6, Opera 9.5, Safari 3.1. A presentation by
  4. 4. w is YUI? hat features of YUI 6 types of YUI components: core utilities UI controls CSS components developer tools build tools A presentation by
  5. 5. w does it all m hat ean? features of YUI (continued) core: a set of tools for event managem and DOM ent m anipulation. YAHOO! Glo bal Obje c t –contains language utilities and other infrastructure for YUI. DOM Co lle c tio n –simplifies com on DOM scripting m tasks such as positioning and CSS Style Managem ent. Eve nt Utility –provides developers easy & safe access to brow events such as m ser ouse clicks and key presses. A presentation by
  6. 6. w does it all m hat ean? features of YUI (continued) utilities: reusable infrastructure libraries that handle things like events, Ajax calls, anim ation, and drag and drop. • animatio n • imag e lo ade r • bro ws e r his to ry manag e r • JS ON (JavaScript Object Notation) • c o nne c tio n manag e r • re s ize • data s o urc e • s e le c to r • drag and dro p • YUI lo ade r A presentation by
  7. 7. w does it all m hat ean? features of YUI (continued) UI controls: • auto -c o mple te •imag e c ro ppe r •butto n •layo ut manag e r me nu •c ale ndar •ric h te xt e dito r •c harts •s lide r •c o lo r pic ke r •tab vie w •c o ntaine r •tre e vie w •data table •uplo ade d A presentation by
  8. 8. w does it all m hat ean? features of YUI (continued) developer tools: lo g g e r –read or w log m rite essages w a single line of ith code! pro file r –non-visual code profiler that allow you to specify s which parts of your application to profile. Pro file Vie we r –used w Profiler to provide visualizations of ith profiling data in graphical and tabular format. YUI Te s t –create test cases, failure detection, etc. for browser-based JavaScript solutions. A presentation by
  9. 9. w does it look like? hat working examples: e ve nt utility - http://developer.yahoo.com/yui/examples/event/eventsimple.html us ing c us to m units fo r an animatio n - http://developer.yahoo.com/yui/examples/animation/units.html bas ic drag and dro p - http://developer.yahoo.com/yui/examples/dragdrop/dd-basic.html animate d pro xy re -s ize - http://developer.yahoo.com/yui/examples/ resize/anim_resize.html s ubmit fo rm - http://developer.yahoo.com/yui/examples/button/btn_example05.html A presentation by
  10. 10. w uses YUI? ho http ://www .linke din .c o m / http ://www .je tblue .c o m / http ://www .targ e t.c o m / http ://www .s mug mug .c o m / http ://www .s o uthwe s t.c o m / http ://imag e s .ins ug g e s t.c o m / http ://www .dataffe c t.c o m /us g s /# http ://www .tag 4 yo u .c o m /flic kr.php A presentation by
  11. 11. w to get som ant e? hello@momentumdesignlab.com 1.866.542.7124 A presentation by

×