2 minutes

How to Make a Flat Styled jQuery UI Combo Box Widget (Part 2)


How to Make a Flat Styled jQuery UI Combo Box Widget (Part 2)

Designmodo user interface kits are a great starting place for a number of projects, including the framework for a variety of widgets that work great with a little jQuery help.

In this video, developer David East uses follows up on ways to use the combo box you used in Part 1 of this video series. He explains how to take your box and give the widget some additional functionality, such autocomplete.

The widget will feature flat styling and works with parts from Designmodo’s Square UI kit.

This step-by-step tutorial is easy to follow and you can watch it while working on your own combo box. It is recommended to start with Part 1: How to Create a Flat Styled Combo Box with Square UI before completing this tutorial.

What you will learn in this tutorial: How to add a widget or plugin built in Photoshop to your website and add functionality to it with jQuery. (And why creating the widget in this manner is a good option for your site.)

Video run time: 45 minutes

Skill level: Intermediate to advanced coding and knowledge of development tools, including jQuery, is recommended. Users will also need a working knowledge of Adobe Photoshop.

Impress your audience with animated websites and web presentations.

With Slides, we don’t make you start from an empty slate. All you have to do is to pick the elements you like best and combine them. Each slide has been carefully crafted to satisfy three key criteria: aesthetic, function and usability. That way you know every element works together seamlessly while enhancing the impact of your content.

Create a Website

Download Source Code


David East

David East is a Developer Programs Engineer for Google, working on Firebase in San Francisco. He's a die-hard JavaScript fan and a budding iOS developer. He also likes waffles. If you like to write code—or eat waffles—follow him on twitter: @_davideast.

Posts by David East

Animated Presentations Made Easy

Learn more All Products
Cookie Icon
We use cookies to ensure that we give you the best experience on our website.
  • I disagree
  • I agree