Index
A
- accessHide class / Time for action – creating a pie chart
- action attribute / Time for action – setting up an HTML5 web form
- addClass method / Time for action – adding some final touches
- AJAX / Video player
- alt option / Time for action – customizing PowerTip
- amp class / Time for action – creating a bold text block with SlabText
- animations
- horizontal animation, creating / Creating other animations, What just happened?
- appendTo() method / Time for action – creating a simple crossfade slideshow, Time for action – creating a pie chart
- arctext() method / Time for action – setting text on a curve with the ArcText plugin
- ArcText plugin
- text, setting on curve with / Time for action – setting text on a curve with the ArcText plugin
- URL / Time for action – setting text on a curve with the ArcText plugin
- argument / Objects
B
- background-size property / Using fullscreen backgrounds
- URL, for information / Time for action – setting up the HTML file
- barMargin option / Time for action – showing data in graphs and charts
- Basic Slider plugin
- downloading, URL / Using the Basic Slider plugin
- about / Using the Basic Slider plugin
- used, for creating slider / Time for action – building a Basic Slider, What just happened?
- behavior, Colorbox
- customizing / Customizing Colorbox's behavior
- bold text block
- creating, with SlabText / Creating bold text blocks, Time for action – creating a bold text block with SlabText
- branches / Time for action – downloading and attaching jQuery
C
- Caption2 option, Cycle2 plugin / Time for action – building a slideshow with Cycle2
- carousel
- creating, with Cycle2 plugin / Time for action – building a Cycle2 carousel
- combining, with Cycle2 slideshow / Combining a carousel with a slideshow
- connecting, with slider / Time for action – connecting the carousel and the slider
- CDN
- about / Another option for using jQuery
- chaining / Time for action – showing custom content in tooltips
- charts
- creating, from HTML tables / Time for action – showing data in graphs and charts, What just happened?
- height, setting / Time for action – calculating the ideal size for charts and graphs
- width, setting / Time for action – calculating the ideal size for charts and graphs
- checkbox
- class attribute / Time for action – validating form values on the fly
- cloudy weather forecast
- parallax effect, adding to / Time for action – creating a parallax effect, What just happened?
- Colorbox
- URL / Time for action – setting up a simple photo gallery
- behavior, customizing / Customizing Colorbox's behavior
- custom transition, creating / Time for action – using a custom transition
- fixed size, setting for / Time for action – setting a fixed size
- colorbox() method / Time for action – setting up a simple photo gallery
- Colorbox plugin
- used, for creating simple photo gallery / Time for action – setting up a simple photo gallery
- columnWidth option / Time for action – creating a masonry layout, Time for action – creating a tiled layout with different width items
- content / Content
- creditcard class / Time for action – validating form values on the fly
- crossfade slideshow
- about / A simple crossfade slideshow
- creating, from scratch / Time for action – creating a simple crossfade slideshow, What just happened?
- curve
- ArcText plugin used, for setting text on / Time for action – setting text on a curve with the ArcText plugin
- custom Colorbox
- creating / Have a go hero – create a custom Colorbox
- custom content
- loading, in tooltips / Time for action – showing custom content in tooltips
- custom tooltips
- about / Simple custom tooltips
- creating / Time for action – simple custom tooltips, What just happened?
- used, for navigation bar enhancing / Time for action – building a fancy navigation bar, What just happened?
- content, loading in / Showing other content in tooltips, Time for action – showing custom content in tooltips
- Cycle2 carousel controller
- Cycle2 plugin
- about / Creating a Cycle2 slideshow
- used, for building slideshow / Time for action – building a slideshow with Cycle2
- URL / Time for action – building a slideshow with Cycle2, Time for action – building a Cycle2 carousel
- download, URL / Time for action – building a slideshow with Cycle2
- used, for building carousel / The Cycle2 carousel, Time for action – building a Cycle2 carousel
- documentation, URL / Time for action – building a Cycle2 carousel
- Cycle2 slideshow
- building, points / Planning a slideshow or slider
- building, with Cycle2 plugin / Time for action – building a slideshow with Cycle2
- customizing / Time for action – building a slideshow with Cycle2
- carousel, combining with / Combining a carousel with a slideshow, Setting up the carousel
D
- data grid
- about / A basic data grid
- creating / Time for action – creating a basic data grid
- customizing / Time for action – customizing the data grid
- DataTables plugin
- DesktopServer
- about / Video player
- URL, for downloading / Video player
E
- eat method / Objects
- end() method / Time for action – creating a simple crossfade slideshow
- event / Time for action – creating simple tabs
- event handler / Time for action – creating simple tabs
F
- *focus pseudoclass
- styling / Styling the :focus pseudoclass
- Superfish menus, customizing / Time for action – customizing Superfish menus
- -file selector
- <figure> element
- fadeIn() method / Time for action – creating a simple crossfade slideshow
- fadeOut() method / Time for action – creating a simple crossfade slideshow
- fancy effects
- creating, with Lettering.js / Have a go hero – creating fancy effects with Lettering.js
- Fancyform plugin
- fancy login form
- creating, in lightbox / Time for action – creating a fancy login form
- FAQ page
- HTML file, setting up / Time for action – setting up the HTML file, What just happened?
- HTML document, moving around / Time for action – moving around an HTML document
- new features, adding / Sprucing up our FAQ page, Time for action – making it fancy
- finishing touches, adding / Time for action – adding some final touches, What just happened?
- fieldset
- fieldset tag
- file input
- filter method / Time for action – creating simple tabs
- first field
- selecting, in form / Setting focus, Time for action – setting focus to the first field
- FitText
- fitText() method / Time for action – sizing headlines to the screen width
- fitText option / Time for action – setting text on a curve with the ArcText plugin
- FitVids
- used, for fitting videos in responsive designs / Using FitVids for responsive videos, Time for action – resizing videos, What just happened?
- URL / Time for action – resizing videos
- fitVids() method / What just happened?
- fixed size
- setting, for Colorbox / Time for action – setting a fixed size
- focus() method / Time for action – setting focus to the first field
- Font Awesome
- for attribute / Time for action – setting up an HTML5 web form, Time for action – validating form values on the fly
- form
- first field, selecting / Setting focus, Time for action – setting focus to the first field
- user entry, validating / Validating site visitor entry, Time for action – validating form values on the fly, What just happened?
- form appearance
- improving / Improving the appearance, Time for action – improving form appearance, What just happened?
- Fancyform plugin, using / Styling the unstyleable, Time for action – adding Fancyform to style the unstyleable
- form elements
- about / Improving the appearance
- fullscreen background image
- fullscreen slideshow
- function, JavaScript / Functions
G
- GitHub
- graceful degradation / Progressive enhancement and graceful degradation
- graphs
- creating, from HTML tables / Time for action – showing data in graphs and charts, What just happened?
- width, setting / Time for action – calculating the ideal size for charts and graphs
- height, setting / Time for action – calculating the ideal size for charts and graphs
H
- *hover pseudoclass / :hover and .sfHover
- <header> element / Time for action – creating a bold text block with SlabText
- hamburger
- about / Responsive menus
- headlines
- sizing, to screen width / Sizing headlines perfectly, Time for action – sizing headlines to the screen width, What just happened?
- horizontal animation
- creating, in windy weather forecast / Time for action – creating a horizontal animation, What just happened?
- horizontal drop-down menu
- hoverIntent plugin
- about / The hoverIntent plugin
- HTML
- setting up, for Scrollorama / Time for action – setting up HTML for Scrollorama, What just happened?
- HTML5 specs
- URL / What just happened?
- HTML5 web form
- about / An HTML5 web form
- setting up / Time for action – setting up an HTML5 web form, What just happened?
- pop quiz / Pop quiz – working with HTML5 form elements
- HTML document
- setting up, for adding scrolling effect / Setting up the document, Time for action – setting up the HTML file, What just happened?
- HTML file, FAQ page
- setting up / Time for action – setting up the HTML file
- HTML tables
- graphs, creating from / Time for action – showing data in graphs and charts
- charts, creating from / Time for action – showing data in graphs and charts
I
- <input> tag / Time for action – setting up an HTML5 web form
- id attribute / Time for action – setting up an HTML5 web form
- ImageOptim
- image option
- images
- transition, modifying between / Time for action – using a custom transition
- lazy loading images / Lazy loading images
- zoomable images, creating / Creating zoomable images
- fullscreen backgrounds, using / Using fullscreen backgrounds
- initialHeight setting / What just happened?
- initialWidth setting / What just happened?
- innerHeight setting / What just happened?
- innerWidth setting / What just happened?
- Internet Explorer (IE) / Time for action – downloading and attaching jQuery
- itemSelector option / Time for action – creating a masonry layout
J
- JavaScript
- basics / JavaScript basics
- about / Designer, Meet JavaScript
- variables / Variables
- objects / Objects
- function / Functions
- moving, from one element to other / Time for action – moving around an HTML document
- JavaScript basics
- progressive enhancement / Progressive enhancement and graceful degradation
- graceful degradation / Progressive enhancement and graceful degradation
- web pages, content / Content
- web pages, presentation layer / Presentation
- web pages, behavior / Behavior
- JPEGmini
- jQuery
- about / What is jQuery?
- features / Why is jQuery awesome for designers?
- downloading / Time for action – downloading and attaching jQuery
- URL / Time for action – downloading and attaching jQuery, Another option for using jQuery
- using, option / Another option for using jQuery
- plugin / Choosing a plugin
- jQuery, features
- CSS selectors / It uses CSS selectors you already know
- HTML markup / It uses HTML markup you already know
- effects / Impressive effects in just a few lines of code
- plugin library / Huge plugin library available
- community support / Great community support
- jQuery function / What just happened?
- jQuery plugins
- URL / Designer, meet plugins
- jQuery script
- starting with / Time for action – getting ready for jQuery, What just happened?
- jQuery UI / A customized data grid
- jQuery Visualize plugin
- on GitHub, URL / Time for action – showing data in graphs and charts
L
- <label> tag / Time for action – setting up an HTML5 web form, Time for action – validating form values on the fly
- lazy loading images
- about / Lazy loading images
- page of images, setting up / Time for action – lazy loading images
- legend tag
- lettering() method / Time for action – using Lettering.js to style letters
- Lettering.js
- used, to style letters / Styling individual letters, Time for action – using Lettering.js to style letters, What just happened?
- URL / Time for action – using Lettering.js to style letters
- fancy effects, creating with / Have a go hero – creating fancy effects with Lettering.js
- letters
- styling, Lettering.js used / Time for action – using Lettering.js to style letters, What just happened?
- lightbox
- fancy login form, creating in / Time for action – creating a fancy login form, What just happened?
- video, setting up in / Time for action – showing a video in a lightbox, What just happened?
- lightbox image gallery
- turning, into slideshow / Time for action – creating a slideshow, What just happened?
M
- masonry() method / Time for action – creating a masonry layout
- Masonry library
- used, for creating tiled layouts / Time for action – creating a masonry layout, What just happened?
- URL / Time for action – creating a masonry layout
- max attribute / Time for action – validating form values on the fly
- maxHeight setting / What just happened?
- maxWidth setting / What just happened?
- MeanMenu plugin, GitHub
- used, for making menus responsive / Time for action – making our menu responsive, What just happened?
- URL / Time for action – making our menu responsive
- menus, responsive design
- modular scale
- about / Sizing headlines perfectly
- URL / Sizing headlines perfectly
N
- name attribute / Time for action – setting up an HTML5 web form
- navigation
- adding / Adding navigation
- adding, to page sections / Time for action – adding navigation to sections of the page, What just happened?
- adding, to weather forecast / Time for action – adding navigation to sections of the page, What just happened?
- navigation bar
- enhancing, with custom tooltips / Enhancing navigation with tooltips, Time for action – building a fancy navigation bar, What just happened?
- navigation menu
- customizing / Customizing the navigation menu
- *hover pseudoclass, using / :hover and .sfHover
- .sfHover class, using / :hover and .sfHover
- inherited styles, cascading / Cascading inherited styles
- next() method / Time for action – creating a simple crossfade slideshow
O
- objects, JavaScript / Objects
- one-page web gallery
- onOpen tag / Time for action – creating a fancy login form
P
- page sections
- navigation, adding to / Time for action – adding navigation to sections of the page, What just happened?
- paragraph
- parallax effect
- adding / Adding a parallax effect
- adding, to cloudy weather forecast / Time for action – creating a parallax effect, What just happened?
- parameter / Functions
- pie chart
- creating / Time for action – creating a pie chart
- placeholder attribute / Time for action – setting up an HTML5 web form
- plugin
- about / Designer, meet plugins
- choosing / Choosing a plugin
- choosing, important points / Choosing a plugin
- powerTip method / What just happened?
- PowerTip plugin
- about / Customizing PowerTip's appearance
- customizing / Time for action – customizing PowerTip
- presentation layer / Presentation
- progressive enhancement / Progressive enhancement and graceful degradation
- property / Objects
- pseudoclass selectors / Time for action – creating simple tabs
R
- radio buttons
- ready() method / Time for action – creating a simple crossfade slideshow
- removeClass method / Time for action – adding some final touches
- required attribute / Time for action – validating form values on the fly
- responsive design
- FitVids, used for fitting in videos / Using FitVids for responsive videos, Time for action – resizing videos, What just happened?
- RIOT
- rotate option / Time for action – setting text on a curve with the ArcText plugin
S
- .sfHover class / :hover and .sfHover
- <script> tag / Time for action – creating a bold text block with SlabText
- <span> tag / Time for action – creating a bold text block with SlabText
- screen width
- headlines, sizing to / Sizing headlines perfectly, Time for action – sizing headlines to the screen width, What just happened?
- scrolling effect
- HTML documents, setting up for / Setting up the document, Time for action – setting up the HTML file, What just happened?
- Scrollorama
- HTML, setting up for / Time for action – setting up HTML for Scrollorama, What just happened?
- ServerPress
- about / Video player
- setInterval() method / Time for action – creating a simple crossfade slideshow
- settings, Colorbox
- innerWidth / What just happened?
- innerHeight / What just happened?
- initialWidth / What just happened?
- initialHeight / What just happened?
- maxHeight / What just happened?
- maxWidth / What just happened?
- simple photo gallery
- about / A simple photo gallery
- creating, with Colorbox plugin / Time for action – setting up a simple photo gallery
- SlabText
- bold text block, creating with / Creating bold text blocks, Time for action – creating a bold text block with SlabText
- URL / Time for action – creating a bold text block with SlabText
- slabText() method / What just happened?
- slider
- building, points / Planning a slideshow or slider
- creating, with Basic Slider plugin / Time for action – building a Basic Slider, What just happened?
- connecting, with carousel / Time for action – connecting the carousel and the slider
- slideshow
- lightbox image gallery, turning into / Time for action – creating a slideshow, What just happened?, Time for action – creating a fancy login form, What just happened?
- building, points / Planning a slideshow or slider
- slideshow component
- setting up / Time for action – adding the slideshow
- slideshow function / Time for action – creating a simple crossfade slideshow
- sliding animation
- incorporating / Time for action – incorporating custom animations
- string / Variables
- Superfish menu
- customizing / Have a go hero – further customizing the Superfish menu
- Superfish menus
- customizing / Time for action – customizing Superfish menus
- Superfish plugin
- used, for enhancing horizontal drop-down menu / Time for action – creating a horizontal drop-down menu
- URL / Time for action – creating a horizontal drop-down menu
T
- tabs
- about / Simple tabs
- creating / Time for action – creating simple tabs, What just happened?
- Tabs echo / Simple tabs
- ternary operator / Time for action – calculating the ideal size for charts and graphs
- text
- setting, on curve with ArcText plugin / Time for action – setting text on a curve with the ArcText plugin
- tiled layouts
- creating / Creating a tiled layout, Time for action – creating a masonry layout, What just happened?
- basic HTML document, creating / Time for action – creating a masonry layout
- list items, styling / Time for action – creating a masonry layout
- media query, adding / Time for action – creating a masonry layout
- three-column layout, creating / Time for action – creating a masonry layout
- font size, setting to full size / Time for action – creating a masonry layout
- creating, with different width items / Creating a tiled layout with items of different widths, Time for action – creating a tiled layout with different width items, What just happened?
- title attribute / Time for action – validating form values on the fly
- transition
- modifying, between images / Time for action – using a custom transition
- traversing the DOM / Time for action – moving around an HTML document
- trigger option
- type attribute / Time for action – setting up an HTML5 web form
U
- unveil() method / Time for action – lazy loading images
- Unveil plugin
- user entry
- validating, in form / Validating site visitor entry, Time for action – validating form values on the fly, What just happened?
V
- *visible pseudoclass / Time for action – creating simple tabs
- validate() method / Time for action – validating form values on the fly
- Validation plugin
- value attribute / Time for action – setting up an HTML5 web form
- variables, JavaScript / Variables
- Vegas plugin
- vertical fly-out menu
- video
- displaying, in lightbox / Time for action – showing a video in a lightbox, What just happened?
- video player
- about / Video player
- videos
- fitting, in responsive designs with FitVids / Using FitVids for responsive videos, Time for action – resizing videos, What just happened?
- resizing / Time for action – resizing videos
- Visualize plugin
- used, for creating pie chart / Time for action – creating a pie chart
W
- web form
- about / An HTML5 web form
- WuFoo
- URL / An HTML5 web form
Z
- zoomable images
- creating / Creating zoomable images, Time for action – creating zoomable images
- multiple zoomable images, creating / Time for action – creating multiple zoomable images
- Zoom plugin