Building UI with jQuery and Wijmo

18,933 views
18,781 views

Published on

Chris Bannon shows how jQuery can be used to build powerful UI’s for the Web. Discover the benefits of using jQuery to create interfaces, including a separation from which server-side technology you choose. You’ll walk away with knowledge on how to leverage jQuery & Wijmo when building Web apps.

Published in: Technology, Art & Photos
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
18,933
On SlideShare
0
From Embeds
0
Number of Embeds
11,365
Actions
Shares
0
Downloads
86
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Building UI with jQuery and Wijmo

  1. 1. Building UI with jQuery & Wijmo<br />Chris Bannon<br />
  2. 2. about:me<br />Chris Bannon<br />Product Manager<br />@b4nn0n<br />
  3. 3. jQuery<br />Makes JavaScript easy<br />Same code in every browser<br />Uses CSS selectors to find elements<br />Simplifies Ajax requests<br />
  4. 4. jQuery UI<br />Easily apply animation effects<br />Widget library<br />Turns HTML into interactive UI<br />As easy to use as jQuery<br />Pre-themed with CSS<br />Function in every browser<br />Falls back to semantic HTML markup<br />
  5. 5. Wijmo<br />Builds on jQuery UI (not replaces it)<br />Adds features to jQuery UI widgets<br />Slider, Progressbar, etc.<br />Adds new widgets to jQuery UI<br />Grid, Charts, Tree, etc.<br />Themeroller-ready<br />As easy to use as jQuery<br />HTML5, CSS3and SVG<br />
  6. 6. Wijmo Complete<br />Complete kit of jQuery UI widgets<br />Focused on app-centric UI<br />Data Visualization<br />Charts (Bar, Line, Pie)<br />Grid<br />Tree<br />Data Entry<br />Input (Masked, Numeric, Date)<br />ComboBox<br />Commercial license<br />
  7. 7. Wijmo Open<br />Focused on common UI elements<br />Navigation<br />Menu<br />Tabs<br />Forms<br />Textbox, Checkbox, Radio<br />Calendar <br />Tooltip <br />Layout<br />Accordion, Splitter, SuperPanel<br />Open Source License<br />
  8. 8. How it Works<br />Widget<br />Wijmofy!<br />HTML<br />CSS<br />Java-Script<br />HTML<br />
  9. 9. In Other Words<br />$(“ul”).wijmenu();<br />
  10. 10. $(“code”).show();<br />
  11. 11. Resources<br />Wijmo: http://wijmo.com<br />jQuery: http://jquery.com<br />jQueryUI: http://jqueryui.com<br />Themeroller: http://jqueryui.com/themeroller/<br />Me: http://twitter.com/b4nn0n<br />Thanks!<br />
  12. 12. $(this).end();<br />

×