yui3 is Sexy - 使用 YUI 3 的 Sexy Part !
•
9 likes•8,495 views
This document discusses the benefits of using the YUI library for JavaScript development. It highlights features like the YUI loader, widget architecture based on Base and plugins, and utilities for DOM manipulation, events, animation and more. The document also mentions how YUI supports progressive enhancement, accessibility, internationalization and building scalable web applications.
Recommended
More Related Content
What's hot
What's hot (20)
Similar to yui3 is Sexy - 使用 YUI 3 的 Sexy Part !
Similar to yui3 is Sexy - 使用 YUI 3 的 Sexy Part ! (20)
More from Joseph Chiang
More from Joseph Chiang (20)
Recently uploaded
Recently uploaded (20)
yui3 is Sexy - 使用 YUI 3 的 Sexy Part !
- 1. yui3 is sexy
- 2. Use yui3 Sexy Part
- 3. Most programming languages contain good parts and bad parts. I discovered that I could be a better programmer by using only the good parts and avoiding the bad parts. Yahoo! JavaScript Architect Douglas Crockford http://www.yuiblog.com/blog/2008/05/05/crockford-inheritance/
- 4. YUI3 JavaScript YUI miiiCasa
- 6. YUI().use() CDN Sexy YUI().use() + pulling code off of Yahoo's CDN is damn sexy and should be promoted *VERY* heavily. The creator of jQuery John Resig http://www.quora.com/How-could-YUI3-improve-its-image-compared-to-jQuery-MooTools-etc
- 7. YUI Seed <script src="http://yui.yahooapis.com/3.3.0/build/yui/yui-min.js"></script> YUI Wigets Dial <script> YUI().use(“dial”, function (Y) { (new Y.Dial()).render(); }); </script>
- 8. <!DOCTYPE html> <html> <meta charset=”utf-8”> <script src="http://yui.yahooapis.com/3.3.0/build/yui/yui-min.js"></script> <script> YUI().use(“dial”, function (Y) { (new Y.Dial()).render(); }); </script> <body class=”yui3-skin-sam”></body> </html> Wow! JavaScript CSS? ?
- 9. YUI3 <!DOCTYPE html> <html> <meta charset=”utf-8”> <script src="http://yui.yahooapis.com/3.3.0/build/yui/yui-min.js"></script> <script> YUI().use(“dial”, function (Y) { (new Y.Dial()).render(); }); </script> <body class=”yui3-skin-sam”></body> </html>
- 10. YUI Dial http://josephj.com/training/hinet/yui-dial.html YUI().use(“dial”) modules (new Y.Dial()).render(<selector>); YUI 3 Dial
- 11. YUI 3 Loader yui-min.js CSS Sexy ?
- 13. • Attribute • Base Attribute Utility • Plugin Base Instance • Extension Base Class • Widget Base Widget
- 15. JavaScript set attribute Object
- 16. YUI YUI
- 17. jQuery $(“#foo”).content(); $(“#foo”).content(“blah blah”); $(“#foo-link”).attr(“title”); $(“#foo-link”).attr(“title”, “blah blah”); set get Native JavaScript Unit Test
- 18. YUI Y.one(“#foo”).get(“innerHTML”); Y.one(“#foo”).setContent(“blah blah”); Y.one(“#foo-link”).getAttribute(“title”); Y.one(“#foo-link”).setAttribute(“title”, “blah blah”); Native JavaScript Douglas Crockford “YUI helps you learn JavaScript.” :)
- 20. Scalability Stacks
- 21. YUI For scalable web applications, YUI really excels. Principal Front End Engineer, Yahoo! Nicholas Zakas http://www.nczonline.net/blog/2010/11/03/response-to-john-resigs-comments-about-yui/
- 22. Yahoo! JavaScript Semantic Accessibility Widget Customization Usability Progressive Enhancement Performance
- 23. • YUI Test • YUI DataType JavaScript • YUI Docs JavaScript API • YUI Profiler • YUI Build Building Blocks • YUI Compressor JS/CSS • YUI I18N
- 24. Progressive Enhancement module
- 25. YUI History http://developer.yahoo.com/yui/3/history HTML 5, Flash, Google Gear
- 26. YUI 2 Storage http://developer.yahoo.com/yui/storage HTML 5, SWF, Google Gear
- 28. Thank You http://developer.yahoo.com/yui/ josephj6802@gmail.com