Jquery Filament Group
-
Upload
govind-shukla -
Category
Documents
-
view
196 -
download
1
Transcript of Jquery Filament Group
![Page 1: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/1.jpg)
The jQuery UI CSS Framework & ThemeRollerAn in-depth overview of theming and design in jQuery UI.
Todd Parker & Scott Jehl
![Page 2: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/2.jpg)
The jQuery UI CSS Framework & ThemeRoller
hello.
Todd Parker Scott Jehl
![Page 3: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/3.jpg)
The jQuery UI CSS Framework & ThemeRoller
A Boston-based design firm specializing in complex web application design & development.
Official Sponsor and Design Team
![Page 4: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/4.jpg)
The jQuery UI CSS Framework & ThemeRoller
Theming in jQuery UIhow we got to where we are today...
A brief history of
![Page 5: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/5.jpg)
The jQuery UI CSS Framework & ThemeRoller
how things
used to be...
![Page 6: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/6.jpg)
The jQuery UI CSS Framework & ThemeRoller
hand-coded themes
![Page 7: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/7.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 8: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/8.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 9: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/9.jpg)
The jQuery UI CSS Framework & ThemeRoller
CSS + Photoshop + Firebug
skills required
![Page 10: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/10.jpg)
The jQuery UI CSS Framework & ThemeRoller
Simpler theming(ThemeRoller v.1.0)
A step towards
![Page 11: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/11.jpg)
The jQuery UI CSS Framework & ThemeRoller
(Version 1.0)
![Page 12: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/12.jpg)
The jQuery UI CSS Framework & ThemeRoller
A GUI for theming jQuery UI widgets
![Page 13: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/13.jpg)
The jQuery UI CSS Framework & ThemeRoller
Keep it simplefocus on the design, not editing CSS
![Page 14: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/14.jpg)
The jQuery UI CSS Framework & ThemeRoller
tmi...
![Page 15: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/15.jpg)
The jQuery UI CSS Framework & ThemeRoller
But not too simplepre-built themes are limited
![Page 16: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/16.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 17: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/17.jpg)
The jQuery UI CSS Framework & ThemeRoller
A middle groundsimple, but powerful
![Page 18: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/18.jpg)
The jQuery UI CSS Framework & ThemeRoller
Created by !lament group inc.
Simply choose your style and colors, then download a custom theme !le.
View theme gallery Preview themeDownload (zip)Save to gallery
ThemeRoller
![Page 19: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/19.jpg)
The jQuery UI CSS Framework & ThemeRoller
good. but not without few problems...
![Page 20: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/20.jpg)
The jQuery UI CSS Framework & ThemeRoller
Not separated.Widget + Theme CSS intertwined
![Page 21: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/21.jpg)
The jQuery UI CSS Framework & ThemeRoller
.ui-dialog-title {
background-color: ...;
margin: ...;
padding:...;
color: ...;
}
![Page 22: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/22.jpg)
The jQuery UI CSS Framework & ThemeRoller
Not static.PHP in our CSS
![Page 23: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/23.jpg)
The jQuery UI CSS Framework & ThemeRoller
.ui-dialog-title {
background-color: <?=$defaultBGColor; ?>;
}
![Page 24: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/24.jpg)
The jQuery UI CSS Framework & ThemeRoller
Not versioned.CSS lives on the web server.
![Page 25: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/25.jpg)
The jQuery UI CSS Framework & ThemeRoller
theme.css.php
![Page 26: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/26.jpg)
The jQuery UI CSS Framework & ThemeRoller
Not easily integrated.Where do I download widgets AND themes?
![Page 27: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/27.jpg)
The jQuery UI CSS Framework & ThemeRoller
Not well supported.Do we support Flora or ThemeRoller? Both?
![Page 28: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/28.jpg)
The jQuery UI CSS Framework & ThemeRoller
...and a bit limitedneeds more levers, more control
![Page 29: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/29.jpg)
The jQuery UI CSS Framework & ThemeRoller
September ‘08
joins the jQuery UI team as sponsor and design lead
![Page 30: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/30.jpg)
The jQuery UI CSS Framework & ThemeRoller
jQuery UI version 1.7including ThemeRoller V2 & UI CSS framework
Big changes underway!
![Page 31: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/31.jpg)
The jQuery UI CSS Framework & ThemeRoller
jQuery UI 1.7refactored widgets, simplified markup
![Page 32: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/32.jpg)
The jQuery UI CSS Framework & ThemeRoller
jQuery UI CSS FrameworkConsistent system for theming all widgets
![Page 33: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/33.jpg)
The jQuery UI CSS Framework & ThemeRoller
and
ThemeRoller v2.0built to manipulate the new framework
![Page 34: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/34.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 35: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/35.jpg)
The jQuery UI CSS Framework & ThemeRoller
Consistency across UIcommon classes for global control
![Page 36: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/36.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 37: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/37.jpg)
The jQuery UI CSS Framework & ThemeRoller
New levers addedheader, highlight, error, overlay, shadow
![Page 38: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/38.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 39: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/39.jpg)
The jQuery UI CSS Framework & ThemeRoller
More design flexibility colors + PNG textures = millions of combos
![Page 40: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/40.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 41: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/41.jpg)
The jQuery UI CSS Framework & ThemeRoller
Image texture w/variable opacity
Flat color
PNG Composite image
![Page 42: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/42.jpg)
The jQuery UI CSS Framework & ThemeRoller
CSS3 rounded cornersfewer requests, more flexible, less markup
![Page 43: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/43.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 44: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/44.jpg)
The jQuery UI CSS Framework & ThemeRoller
Flexible CSS unitsems and % allow proportional scaling
![Page 45: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/45.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 46: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/46.jpg)
The jQuery UI CSS Framework & ThemeRoller
Icon sprites173 free, themable icons, 1 request per color
![Page 47: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/47.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 48: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/48.jpg)
The jQuery UI CSS Framework & ThemeRoller
New themes!24 total: new and refreshed
![Page 49: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/49.jpg)
The jQuery UI CSS Framework & ThemeRoller
Scott J’s creation
![Page 50: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/50.jpg)
The jQuery UI CSS Framework & ThemeRoller
Google CDN hostingfor all gallery themes!
![Page 51: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/51.jpg)
The jQuery UI CSS Framework & ThemeRoller
http://www.jqueryui.com/development
![Page 52: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/52.jpg)
The jQuery UI CSS Framework & ThemeRoller
Permanent theme URLsbookmark, email, tweak
![Page 53: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/53.jpg)
The jQuery UI CSS Framework & ThemeRoller
ui.theme.css
![Page 54: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/54.jpg)
The jQuery UI CSS Framework & ThemeRoller
Downloader integrationcustom & gallery theme selector built-in
![Page 55: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/55.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 56: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/56.jpg)
The jQuery UI CSS Framework & ThemeRoller
Using ThemeRoller
let’s see this thing already!
![Page 57: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/57.jpg)
The jQuery UI CSS Framework & ThemeRoller
Video Demo Slide (not available in this format)Try ThemeRoller live at:http://themeroller.com
![Page 58: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/58.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 59: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/59.jpg)
The jQuery UI CSS Framework & ThemeRoller
cool. so...
what’s in the zip?
![Page 60: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/60.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 61: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/61.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 62: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/62.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 63: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/63.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 64: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/64.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 65: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/65.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 66: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/66.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 67: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/67.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 68: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/68.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 69: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/69.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 70: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/70.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 71: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/71.jpg)
The jQuery UI CSS Framework & ThemeRoller
jQuery UI CSS Framework
The bird’s eye view:
Using ThemeRoller as our guide
![Page 72: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/72.jpg)
The jQuery UI CSS Framework & ThemeRoller
Clean separationof widget and theme styles
![Page 73: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/73.jpg)
The jQuery UI CSS Framework & ThemeRoller
Class Breakdown:
theme-specificwidget-specific
![Page 74: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/74.jpg)
The jQuery UI CSS Framework & ThemeRoller
Widget-specific classesdimensions, visibility, positioning, margins, padding
![Page 75: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/75.jpg)
The jQuery UI CSS Framework & ThemeRoller
Theme-specific classestext colors, backgrounds, fonts, icons
![Page 76: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/76.jpg)
The jQuery UI CSS Framework & ThemeRoller
Global font settingsapply with .ui-widget
![Page 77: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/77.jpg)
The jQuery UI CSS Framework & ThemeRoller
7 primary theme “levers”Generic, semantic names
![Page 78: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/78.jpg)
The jQuery UI CSS Framework & ThemeRoller
.ui-widget-header
.ui-widget-content
Containers
![Page 79: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/79.jpg)
The jQuery UI CSS Framework & ThemeRoller
ui-state-defaultui-state-hover
ui-state-active
Clickable states
![Page 80: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/80.jpg)
The jQuery UI CSS Framework & ThemeRoller
ui-state-highlight ui-state-error
System states
![Page 81: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/81.jpg)
The jQuery UI CSS Framework & ThemeRoller
ui-widget-overlay ui-widget-shadow
Overlay elements
![Page 82: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/82.jpg)
The jQuery UI CSS Framework & ThemeRoller
theme levers define
color & texture only
![Page 83: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/83.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 84: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/84.jpg)
The jQuery UI CSS Framework & ThemeRoller
.ui-icon-arrowthick-1-n
.ui-icon-trash
.ui-icon-calendaretc, etc, etc
Icon classes
![Page 85: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/85.jpg)
The jQuery UI CSS Framework & ThemeRoller
Plus a few framework goodies...
![Page 86: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/86.jpg)
The jQuery UI CSS Framework & ThemeRoller
.ui-state-disabled
.ui-priority-primary
.ui-priority-secondary
Interaction cues
![Page 87: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/87.jpg)
The jQuery UI CSS Framework & ThemeRoller
.ui-helper-hidden
.ui-helper-hidden-accessible
.ui-helper-reset
.ui-helper-clearfix
Layout helpers
![Page 88: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/88.jpg)
The jQuery UI CSS Framework & ThemeRoller
And Rounded Corners!using CSS3 border radius
.ui-corner-all
.ui-corner-top
.ui-corner-bottom
.ui-corner-right
.ui-corner-left
.ui-corner-tl
.ui-corner-tr
.ui-corner-bl
.ui-corner-br
![Page 89: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/89.jpg)
The jQuery UI CSS Framework & ThemeRoller
if IE really needs rounded corners *
Script them in!
DD_roundies.addRule('.ui-corner-all', '8px');
* it doesn’t.
![Page 90: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/90.jpg)
The jQuery UI CSS Framework & ThemeRoller
jQuery UI CSS Framework
the worm’s eye view:
![Page 91: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/91.jpg)
The jQuery UI CSS Framework & ThemeRoller
UI tabs deconstructed:
![Page 92: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/92.jpg)
The jQuery UI CSS Framework & ThemeRoller
Tabs Markup
![Page 93: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/93.jpg)
The jQuery UI CSS Framework & ThemeRoller
Tabs HTML<div id=”tabs”>
<ul>
<li><a href="#tabs-1">First</a></li>
<li><a href="#tabs-2">Second</a></li>
<li><a href="#tabs-3">Third</a></li>
</ul>
<div id="tabs-1">Lorem ipsum dolor.</div>
<div id="tabs-2">Lorem ipsum dolor.</div>
<div id="tabs-3">Lorem ipsum dolor.</div>
</div>
![Page 94: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/94.jpg)
The jQuery UI CSS Framework & ThemeRoller
Add Widget-specific classes
![Page 95: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/95.jpg)
The jQuery UI CSS Framework & ThemeRoller
<div id="tabs" class="ui-tabs">
<ul class="ui-tabs-nav">
<li class="ui-tabs-selected"><a href="#tabs-1">First</a></li>
<li><a href="#tabs-2">Second</a></li>
<li><a href="#tabs-3">Third</a></li>
</ul>
<div id="tabs-1" class="ui-tabs-panel">Lorem ipsum dolor.</div>
<div id="tabs-2" class="ui-tabs-panel ui-tabs-hide">...</div>
<div id="tabs-3" class="ui-tabs-panel ui-tabs-hide">...</div>
</div>
Tabs HTML
![Page 96: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/96.jpg)
The jQuery UI CSS Framework & ThemeRoller
.ui-tabs {
padding: .2em;
}
.ui-tabs .ui-tabs-nav {
list-style: none;
position: relative;
padding: .2em .2em 0;
margin: 0;
}
.ui-tabs .ui-tabs-nav li {
position: relative;
ui.tabs.css
![Page 97: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/97.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 98: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/98.jpg)
The jQuery UI CSS Framework & ThemeRoller
Add theme-specific classes
![Page 99: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/99.jpg)
The jQuery UI CSS Framework & ThemeRoller
Add ui-widget to parentsets theme font and size
![Page 100: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/100.jpg)
The jQuery UI CSS Framework & ThemeRoller
Tabs HTML<div id="tabs" class="ui-tabs ui-widget">
<ul class="ui-tabs-nav">
<li class="ui-tabs-selected"><a href="#tabs-1">First</a></li>
<li><a href="#tabs-2">Second</a></li>
<li><a href="#tabs-3">Third</a></li>
</ul>
<div id="tabs-1" class="ui-tabs-panel">Lorem ipsum dolor.</div>
<div id="tabs-2" class="ui-tabs-panel ui-tabs-hide">...</div>
<div id="tabs-3" class="ui-tabs-panel ui-tabs-hide">...</div>
</div>
![Page 101: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/101.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 102: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/102.jpg)
The jQuery UI CSS Framework & ThemeRoller
Add container classessets color, border, background,
![Page 103: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/103.jpg)
The jQuery UI CSS Framework & ThemeRoller
<div id="tabs" class="ui-tabs ui-widget ui-widget-content">
<ul class="ui-tabs-nav ui-widget-header">
...
</ul>
<div id="tabs-1" class="ui-tabs-panel ui-widget-content">...</div>
<div id="tabs-2" class="ui-tabs-panel ui-tabs-hide ui-widget-
content">...</div>
<div id="tabs-3" class="ui-tabs-panel ui-tabs-hide ui-widget-
content">...</div>
</div>
Tabs HTML
![Page 104: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/104.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 105: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/105.jpg)
The jQuery UI CSS Framework & ThemeRoller
Add state classesclickable, hover, active, etc
![Page 106: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/106.jpg)
The jQuery UI CSS Framework & ThemeRoller
<div id="tabs" class="ui-tabs ui-widget ui-widget-content">
<ul class="ui-tabs-nav ui-widget-header">
<li class="ui-tabs-selected ui-state-active"><a
href="#tabs-1">First</a></li>
<li class=”ui-state-default”><a href="#tabs-2">Second</a></li>
<li class=”ui-state-default”><a href="#tabs-3">Third</a></li>
</ul>
...
</div>
Tabs HTML
![Page 107: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/107.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 108: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/108.jpg)
The jQuery UI CSS Framework & ThemeRoller
Smooth it outdecide what corners to round
![Page 109: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/109.jpg)
The jQuery UI CSS Framework & ThemeRoller
Tabs HTML<div id="tabs" class="ui-tabs ui-widget ui-widget-content ui-corner-
all">
<ul class="ui-tabs-nav ui-widget-header ui-corner-all">
<li class="ui-tabs-selected ui-state-active ui-corner-top"><a
href="#tabs-1">First</a></li>
<li class=”ui-state-default ui-corner-top”><a
href="#tabs-2">Second</a></li>
<li class=”ui-state-default ui-corner-top”><a
href="#tabs-3">Third</a></li>
</ul>
...
![Page 110: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/110.jpg)
The jQuery UI CSS Framework & ThemeRoller
Done.
![Page 111: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/111.jpg)
The jQuery UI CSS Framework & ThemeRoller
Multiple scoped themes
Taking it further...
![Page 112: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/112.jpg)
The jQuery UI CSS Framework & ThemeRoller
<link type="text/css" href="css/redmond/jquery-
ui-1.7.2.custom.css" rel="stylesheet" />
Link to UI themeimport the theme CSS in the <head>
![Page 113: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/113.jpg)
The jQuery UI CSS Framework & ThemeRoller
JS: $(‘.datepicker’).datepicker();
Add two datepickers
<div class="datepicker"></div>
<div class="datepicker"></div>
![Page 114: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/114.jpg)
The jQuery UI CSS Framework & ThemeRoller
Redmond themes all widgets
![Page 115: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/115.jpg)
The jQuery UI CSS Framework & ThemeRoller
<div class="datepicker"></div>
<div class="mysection">
<div class="datepicker"></div>
</div>
Let’s theme one differentlywrap one in “.mysection” div for scoping
![Page 116: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/116.jpg)
The jQuery UI CSS Framework & ThemeRoller
Back to the download builder!add theme scoping, get zip
.mysection
mysection
![Page 117: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/117.jpg)
The jQuery UI CSS Framework & ThemeRoller
Headaches savedThemeRoller adds scope selector to every rule
![Page 118: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/118.jpg)
The jQuery UI CSS Framework & ThemeRoller
Grab the theme folderpaste into CSS/ alongside other theme
![Page 119: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/119.jpg)
The jQuery UI CSS Framework & ThemeRoller
<link type="text/css" href="css/redmond/jquery-
ui-1.7.2.custom.css" rel="stylesheet" />
<link type="text/css" href="css/mysection/jquery-
ui-1.7.2.custom.css" rel="stylesheet" />
Link to new theme
![Page 120: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/120.jpg)
The jQuery UI CSS Framework & ThemeRoller
2 themes, 1 page.
![Page 121: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/121.jpg)
The jQuery UI CSS Framework & ThemeRoller
ThemeRoller-ready
How 3rd party plugins can be
![Page 122: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/122.jpg)
The jQuery UI CSS Framework & ThemeRoller
![Page 123: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/123.jpg)
The jQuery UI CSS Framework & ThemeRoller
Yum.we’re eating our own dog food
![Page 124: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/124.jpg)
The jQuery UI CSS Framework & ThemeRoller
Same theming toolsfor official jQuery UI & 3rd party plugins
![Page 125: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/125.jpg)
The jQuery UI CSS Framework & ThemeRoller
Easy to usejust use the framework classes
![Page 126: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/126.jpg)
The jQuery UI CSS Framework & ThemeRoller
for example...let’s make a button!
![Page 127: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/127.jpg)
The jQuery UI CSS Framework & ThemeRoller
<link type="text/css" href="css/start/jquery-
ui-1.7.2.custom.css" rel="stylesheet" />
Link to CSSimport the UI theme into your page
![Page 128: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/128.jpg)
The jQuery UI CSS Framework & ThemeRoller
<button>Click me</button>
basic markupwith some padding and cursor CSS too
button { padding:0.5em; cursor: pointer; }
![Page 129: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/129.jpg)
The jQuery UI CSS Framework & ThemeRoller
<button class=”ui-widget”>Click me</button>
ui-widget classapplies Theme font settings
![Page 130: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/130.jpg)
The jQuery UI CSS Framework & ThemeRoller
<button class="ui-widget ui-state-default">Click
me</button>
clickable theme classadds theme’s look and feel
![Page 131: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/131.jpg)
The jQuery UI CSS Framework & ThemeRoller
<button class="ui-widget ui-state-hover">Click
me</button>
hover class replaces defaultscripted to make IE happy
![Page 132: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/132.jpg)
The jQuery UI CSS Framework & ThemeRoller
<button class="ui-widget ui-state-default ui-
state-disabled">Click me</button>
disabled classsets transparency to dim element *
*combine with disabled=”disabled” attr
![Page 133: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/133.jpg)
The jQuery UI CSS Framework & ThemeRoller
<button class="ui-widget ui-state-default ui-
priority-primary">Click me</button>
<button class="ui-widget ui-state-default ui-
priority-secondary">Cancel</button>
primary / secondarypriority classes for emphasis
![Page 134: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/134.jpg)
The jQuery UI CSS Framework & ThemeRoller
<button class="ui-widget ui-state-default ui-
corner-all">Click me</button>
rounded cornersclasses for rounding 1 corner, a side, or all 4!
![Page 135: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/135.jpg)
The jQuery UI CSS Framework & ThemeRoller
A few examplesThemeRoller-ready plugins
![Page 136: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/136.jpg)
The jQuery UI CSS Framework & ThemeRoller
http://www.trirand.com/jqgrid/jqgrid.html
jQ Grid
![Page 137: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/137.jpg)
The jQuery UI CSS Framework & ThemeRoller
http://www.nicolas.rudas.info/jquery/finder/
jQuery Finder
![Page 138: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/138.jpg)
The jQuery UI CSS Framework & ThemeRoller
http://www.filamentgroup.com/lab/styling_buttons_and_toolbars_with_the_jquery_ui_css_framework/
Button & toolbar
![Page 139: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/139.jpg)
The jQuery UI CSS Framework & ThemeRoller
http://www.filamentgroup.com/lab/date_range_picker_using_jquery_ui_16_and_jquery_ui_css_framework
Date range picker
![Page 140: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/140.jpg)
The jQuery UI CSS Framework & ThemeRoller
http://www.trirand.com/jqgrid/jqgrid.html
Select to slider
![Page 141: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/141.jpg)
The jQuery UI CSS Framework & ThemeRoller
http://jqueryplugins.weebly.com/jquerysheet.html
jQuery sheet
![Page 142: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/142.jpg)
The jQuery UI CSS Framework & ThemeRoller
http://www.quasipartikel.at/multiselect/
Multi select
![Page 143: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/143.jpg)
The jQuery UI CSS Framework & ThemeRoller
http://www.filamentgroup.com/lab/jquery_ipod_style_and_flyout_menus
iPod, flyout menus
![Page 144: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/144.jpg)
The jQuery UI CSS Framework & ThemeRoller
http://www.happyworm.com/jquery/jplayer/0.2.4/demo-07.htm
jPlayer
![Page 145: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/145.jpg)
The jQuery UI CSS Framework & ThemeRoller
http://www.kelvinluck.com/assets/jquery/jScrollPaneUI/
jScrollPane
![Page 146: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/146.jpg)
The jQuery UI CSS Framework & ThemeRoller
http://plugins.jquery.com/project/ui-checkbox
Checkbox & radio
![Page 147: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/147.jpg)
The jQuery UI CSS Framework & ThemeRoller
http://pttimeselect.sourceforge.net/example/index.html
Time select
![Page 148: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/148.jpg)
The jQuery UI CSS Framework & ThemeRoller
http://chessbomb.com/
ChessBomb
![Page 149: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/149.jpg)
The jQuery UI CSS Framework & ThemeRoller
http://www.filamentgroup.com/examples/peeps/
Peeps
![Page 150: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/150.jpg)
The jQuery UI CSS Framework & ThemeRoller
Firefox bookmarkletpull ThemeRoller into any page
![Page 151: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/151.jpg)
The jQuery UI CSS Framework & ThemeRoller
http://www.jqueryui.com/themeroller/developertool/
![Page 152: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/152.jpg)
The jQuery UI CSS Framework & ThemeRoller
Theme switcher widgetpreview themes on any page on the web!
![Page 153: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/153.jpg)
The jQuery UI CSS Framework & ThemeRoller
http://www.jqueryui.com/docs/Theming/ThemeSwitcher
![Page 154: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/154.jpg)
The jQuery UI CSS Framework & ThemeRoller
No Javascript required use framework classes on static markup too
![Page 155: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/155.jpg)
The jQuery UI CSS Framework & ThemeRoller
Automatic consistencyEnable developers to easily integrate your plugins!
![Page 156: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/156.jpg)
The jQuery UI CSS Framework & ThemeRoller
Give it a trymake it easier for your users
![Page 157: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/157.jpg)
The jQuery UI CSS Framework & ThemeRoller
We’ll pimp your stuffTR-ready plugins will be highly visible
![Page 158: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/158.jpg)
The jQuery UI CSS Framework & ThemeRoller
Moving forwardnew levers, css3, name changes, greater adoption
lastly...
![Page 159: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/159.jpg)
The jQuery UI CSS Framework & ThemeRoller
Questions?
Thanks!
![Page 160: Jquery Filament Group](https://reader033.fdocuments.us/reader033/viewer/2022050919/5477ee1ab4af9f4d108b4aad/html5/thumbnails/160.jpg)
The jQuery UI CSS Framework & ThemeRoller
Thanks Everyone!for more examples, visit filamentgroup.com/lab
the end...