You are previewing jQuery UI Cookbook.
O'Reilly logo
jQuery UI Cookbook

Book Description

For jQuery UI developers this is the ultimate guide to maximizing the potential of your user interfaces. Full of great practical recipes that cover every widget in the framework, it’s an essential manual.

  • Packed with recipes showing UI developers how to get the most out of their jQuery UI widgets

  • Solutions to real-world development issues distilled down in a reader-friendly approach

  • Code examples written in a concise and elegant format making it easy for the reader to adapt to their own style

  • In Detail

    jQuery UI is the quintessential framework for creating professional user interfaces. While jQuery core lays the foundation for interaction with the DOM and handling events, jQuery UI fills in the user interaction gap. This book will give you a huge productivity boost out of the box with jQuery UI, and help you understand the framework, inside and out.

    "jQuery UI Cookbook" provides you with practical recipes featuring in-depth coverage of every widget in the framework, including how to address limitations that impact your everyday development activities with these widgets. You'll get a better idea of the big picture – how the framework is composed, how the widgets relate to one another, and how to build on those patterns.

    Be it a minor tweak on the visual design of a progress bar or a fundamental change in a widget to meet your needs, "jQuery UI Cookbook" covers scenarios both big and small. You can show reminders as tooltips, apply a variety of effects to the menu widget, and start interactions between the dialog widget and API data using deferred objects. These and many more interesting tasks are covered in this book, which can be done with smooth learning and great understanding. You will see how button widgets can fill the width of their containing element, making the layout more consistent. Tabs can be sorted and moved between widgets. You will learn how to do all these things within the context of the big picture, by finding out why the components work the way they do, making you well-versed in jQuery UI.

    Table of Contents

    1. jQuery UI Cookbook
      1. Table of Contents
      2. jQuery UI Cookbook
      3. Credits
      4. About the Author
      5. About the Reviewers
      6. www.PacktPub.com
        1. Support files, eBooks, discount offers and more
          1. Why Subscribe?
          2. Free Access for Packt account holders
      7. Preface
        1. What this book covers
        2. What you need for this book
        3. Who this book is for
        4. Conventions
        5. Reader feedback
        6. Customer support
          1. Downloading the example code
          2. Errata
          3. Piracy
          4. Questions
      8. 1. Creating Accordions
        1. Introduction
        2. Section navigation using the Tab key
          1. Getting ready
          2. How to do it...
          3. How it works...
        3. Dynamically changing the height style
          1. Getting ready
          2. How to do it...
          3. How it works...
        4. Resizable content sections
          1. How to do it...
          2. How it works...
          3. There's more...
        5. Controlling spacing with themes
          1. How to do it...
          2. How it works...
        6. Sorting accordion sections
          1. How to do it...
          2. How it works...
        7. Dragging-and-dropping between accordions
          1. Getting ready
          2. How to do it...
          3. How it works...
      9. 2. Including Autocompletes
        1. Introduction
        2. Styling the default input with themes
          1. Getting ready
          2. How to do it...
          3. How it works...
        3. Building data sources using select options
          1. Getting ready
          2. How to do it...
          3. How it works...
        4. Using multiple data sources
          1. How to do it...
          2. How it works...
        5. Remote autocomplete filtering
          1. How to do it...
          2. How it works...
          3. There's more...
        6. Custom data and categories
          1. How to do it...
          2. How it works...
          3. There's more...
        7. Applying effects to the drop-down menu
          1. Getting ready
          2. How to do it...
          3. How it works...
      10. 3. Crafting Buttons
        1. Introduction
        2. Making simple checklists
          1. Getting ready
          2. How to do it...
          3. How it works...
        3. Controlling the spacing with buttonsets
          1. Getting ready
          2. How to do it...
          3. How it works...
        4. Filling space with buttons automatically
          1. Getting ready
          2. How to do it...
          3. How it works...
          4. There's more...
        5. Sorting buttons within a group
          1. Getting ready
          2. How to do it...
          3. How it works...
        6. Using effects with the button hover state
          1. Getting ready
          2. How to do it...
          3. How it works...
        7. Button icons and hiding text
          1. Getting ready
          2. How to do it...
          3. How it works...
      11. 4. Developing Datepickers
        1. Introduction
        2. Working with different date formats
          1. How to do it...
          2. How it works...
          3. There's more...
        3. Making a full-sized calendar widget
          1. Getting ready
          2. How to do it...
          3. How it works...
        4. Displaying month-to-month effects
          1. Getting ready
          2. How to do it...
          3. How it works...
        5. Appointment reminders as tooltips
          1. How to do it...
          2. How it works...
        6. Restricting the date range
          1. Getting ready...
          2. How to do it...
          3. How it works...
          4. There's more...
        7. Hiding the input field
          1. Getting ready
          2. How to do it...
          3. How it works...
        8. Additional calendar data and controls
          1. Getting started
          2. How to do it...
          3. How it works...
      12. 5. Adding Dialogs
        1. Introduction
        2. Applying effects to dialog components
          1. How to do it...
          2. How it works...
        3. Waiting for API data to load
          1. Getting ready...
          2. How to do it...
          3. How it works...
        4. Using icons in the dialog title
          1. Getting ready...
          2. How to do it...
          3. How it works...
        5. Adding actions to the dialog title
          1. How to do it...
          2. How it works...
        6. Applying effects to dialog resize interactions
          1. Getting ready...
          2. How to do it...
          3. How it works...
        7. Using modal dialogs for messages
          1. Getting ready...
          2. How to do it...
          3. How it works...
      13. 6. Making Menus
        1. Introduction
        2. Creating sortable menu items
          1. Getting ready
          2. How to do it...
          3. How it works...
        3. Highlighting the active menu item
          1. Getting ready
          2. How to do it...
          3. How it works...
        4. Using effects with menu navigation
          1. Getting ready
          2. How to do it...
          3. How it works...
        5. Building menus dynamically
          1. Getting ready
          2. How to do it...
          3. How it works...
          4. There's more...
        6. Controlling the position of submenus
          1. Getting ready
          2. How to do it...
          3. How it works...
        7. Applying themes to submenus
          1. Getting ready
          2. How to do it...
          3. How it works...
      14. 7. Progress Bars
        1. Introduction
        2. Displaying file upload progress
          1. Getting ready
          2. How to do it...
          3. How it works...
        3. Animating progress changes
          1. How to do it...
          2. How it works...
          3. There's more...
        4. Creating progressindicator widgets
          1. How to do it...
          2. How it works...
          3. There's more...
        5. Using states to warn about thresholds
          1. Getting ready
          2. How to do it...
          3. How it works...
        6. Giving progressbars labels
          1. How to do it...
          2. How it works...
          3. There's more...
      15. 8. Using Sliders
        1. Introduction
        2. Controlling the size of the slider handle
          1. Getting ready...
          2. How to do it...
          3. How it works...
        3. Removing the handle focus outline
          1. How to do it...
          2. How it works...
        4. Using master sliders and child sliders
          1. How to do it...
          2. How it works...
        5. Marking step increments
          1. How to do it...
          2. How it works...
        6. Getting range values
          1. Getting ready...
          2. How to do it...
          3. How it works...
        7. Changing the slider orientation
          1. How to do it...
          2. How it works...
      16. 9. Using Spinners
        1. Introduction
        2. Removing the input focus outline
          1. How to do it...
          2. How it works...
        3. Formatting currencies for local cultures
          1. How to do it...
          2. How it works...
        4. Formatting time for local cultures
          1. How to do it...
          2. How it works...
        5. Controlling the step between values
          1. How to do it...
          2. How it works...
          3. There's more...
        6. Specifying the spin overflow
          1. How to do it...
          2. How it works...
          3. There's more...
        7. Simplifying the spinner buttons
          1. How to do it...
          2. How it works...
      17. 10. Using Tabs
        1. Introduction
        2. Working with remote tab content
          1. How to do it...
          2. How it works...
          3. There's more...
        3. Giving tabs an icon
          1. How to do it...
          2. How it works...
        4. Simplifying the tab theme
          1. How to do it...
          2. How it works...
          3. There's more...
        5. Using tabs as URL navigation links
          1. How to do it...
          2. How it works...
        6. Creating effects between tab transitions
          1. How to do it...
          2. How it works...
        7. Sorting tabs using the sortable interaction
          1. How to do it...
          2. How it works...
          3. There's more...
        8. Setting the active tab using href
          1. How to do it...
          2. How it works...
          3. There's more...
      18. 11. Using Tooltips
        1. Introduction
        2. Changing the tooltip state
          1. How to do it...
          2. How it works...
          3. There's more...
        3. Using custom markup in tooltips
          1. How to do it...
          2. How it works...
          3. There's more...
        4. Displaying the mouse movement
          1. How to do it...
          2. How it works...
        5. Applying effects to the tooltip display
          1. How to do it...
          2. How it works...
        6. Tooltips for selected text
          1. How to do it...
          2. How it works...
          3. There's more...
      19. 12. Widgets and More!
        1. Introduction
        2. Accordions to tabs, and back again
          1. How to do it...
          2. How it works...
        3. Building a custom widget from scratch
          1. How to do it...
          2. How it works...
        4. Building an observer widget
          1. How to do it...
          2. How it works...
        5. Using widgets with Backbone applications
          1. How to do it...
          2. How it works...
      20. Index