Yui- Yahoo! User Interface Library

4,588 views
4,450 views

Published on

Published in: Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
4,588
On SlideShare
0
From Embeds
0
Number of Embeds
25
Actions
Shares
0
Downloads
89
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Yui- Yahoo! User Interface Library

  1. 1. YUI Yahoo! User Interface Library A presentation by
  2. 2. contents I.  what is YUI? II.  what does it all mean? III.  what does it look like? IV.  who uses YUI? V.  want to get some? A presentation by
  3. 3. what is YUI? a collection of JavaScript and CSS Resources for building richly interactive web applications using DOM scripting and DHTML and AJAX. developed for internal use but now available 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. what is YUI? features of YUI 6 types of YUI components: core utilities UI controls CSS components developer tools build tools A presentation by
  5. 5. what does it all mean? features of YUI (continued) core: a set of tools for event management and DOM manipulation. YAHOO! Global Object – contains language utilities and other infrastructure for YUI. DOM Collection – simplifies common DOM scripting tasks such as positioning and CSS Style Management. Event Utility – provides developers easy & safe access to browser events such as mouse clicks and key presses. A presentation by
  6. 6. what does it all mean? features of YUI (continued) utilities: reusable infrastructure libraries that handle things like events, Ajax calls, animation, and drag and drop. • animation •  image loader • browser history manager • JSON (JavaScript Object Notation) • connection manager • resize • data source • selector • drag and drop • YUI loader A presentation by
  7. 7. what does it all mean? features of YUI (continued) UI controls: • auto-complete • image cropper • button • layout manager menu • calendar • rich text editor • charts • slider • color picker • tab view • container • tree view • data table • uploaded A presentation by
  8. 8. what does it all mean? features of YUI (continued) developer tools: logger – read or write log messages with a single line of code! profiler – non-visual code profiler that allows you to specify which parts of your application to profile. ProfileViewer – used with Profiler to provide visualizations of profiling data in graphical and tabular format. YUI Test – create test cases, failure detection, etc. for browser-based JavaScript solutions. A presentation by
  9. 9. what does it look like? working examples: event utility- http://developer.yahoo.com/yui/examples/event/ eventsimple.html using custom units for an animation-http:// developer.yahoo.com/yui/examples/animation/units.html basic drag and drop- http://developer.yahoo.com/yui/examples/ dragdrop/dd-basic.html animated proxy re-size- http://developer.yahoo.com/yui/examples/ resize/anim_resize.html submit form-http://developer.yahoo.com/yui/examples/button/ btn_example05.html A presentation by
  10. 10. who uses YUI? http://www.linkedin.com/ http://www.jetblue.com/ http://www.target.com/ http://www.smugmug.com/ http://www.southwest.com/ http://images.insuggest.com/ http://www.dataffect.com/usgs/# http://www.tag4you.com/flickr.php A presentation by
  11. 11. want to get some? hello@momentumdesignlab.com


 
 

 
 
 
 

 
 
 










1.866.542.7124
 
 
 A presentation by

×