From the course: jQuery: UI Widgets

Unlock the full course today

Join today to access over 22,400 courses taught by industry experts or purchase this course individually.

Building an accordion widget

Building an accordion widget - jQuery Tutorial

From the course: jQuery: UI Widgets

Start my 1-month free trial

Building an accordion widget

In this movie we're going to take a loot at what it's like to work generally with jQuery UI widgets, taking the accordion as our example. Here is a page with our fairly plain HTML, and over here is the real file. I have moved around the installation of jQuery UI so that I won't have to copies of it in every singe lesson folder for the exercise files. So eagle-eyed viewers may have noticed that some of these pads are a little different than when we installed it in the installation movie. So here is the mark up. It's fairly simple, just headers followed by divs. Every jQuery UI widget has specific requirements for the structure of its HTML. In the case of the accordion, it's just some sort of header type thing, followed by some sort of other type thing. It can be just about whatever you want, as long as they're at the same level in the DOM. Just read the documentation for the different widget types that you want to implement and make sure that your HTML fits the requirements, or you…

Contents