Create a Simple Autocomplete With HTML5 & jQuery
by Jake Rocheleau on June 17th, 2013
A quick Google search will yield plenty of handy autocomplete plugins — there’s even an option shared by jQuery UI which comes bundled with the library. However today I want to look into an alternative solution. The jQuery Autocomplete plugin released by DevBridge has the exact functionality that I find most appealing.
The styles will automatically highlight words as you are typing, and results appear in the dropdown menu at the bottom. This tutorial is a brief introduction to using the plugin by loading content from a JavaScript array. It is possible to load Ajax content from a backend file or from content out of the database, however for this tutorial it is easier to work with local data. Check out my sample demo to get an idea of what we are trying to build.
Design Dilemma: Which Is Better — Staff or Freelance?
Jill K. writes: I’m graduating art school (yay!) and can’t decide if I should freelance or take a staff position. Which one is better?
Well, congratulations, Jill! I’m guessing none of your teachers discussed the possibilities of a future in the industry. Yet another art school fail. But, the question is valid although you may not have a choice as a new graduate. Let me go over the strengths of each, as well as the pitfalls, and discuss what you will find are your immediate options.
June 12th, 2013Do I Need to Design With SEO in Mind? A Guide for Designers
You’re probably tired of hearing it, but search engine optimization is important. It can dictate and influence who visits a site, and how many people make it through to see your beautiful design work.
It should be a part of the design process from the planning stages forward. So designers, unplug your ears and make it a priority to learn how you can start thinking about SEO in the design process. Let’s dive into the topic a little more today.
June 10th, 2013Building CSS3 Notification Boxes With Fade Animations
Modern web design techniques have allowed developers to quickly implement animations supported by most browsers. I think alert messages are very commonplace, because the default JavaScript alert boxes tend to be pretty intrusive and poorly designed. This leads developers down a path to figure out which solutions would work out better for a more user-friendly interface.
For this tutorial I want to explain how we can put together CSS3 notification boxes which appear at the top of the page body. Users may then click on the notifications to have them fade away and eventually remove them from the DOM. As a fun added feature, I have also included buttons where you may click to append a new alert box into the top of the page. Check out my sample demo to get a better idea of what we’ll be making.
June 6th, 201330+ Innovative New jQuery Plugins
Many web developers are jumping into the sea of open source code projects. New plugins and frameworks are released almost every day. And when you are busy at work it can be tough keeping up with all the newest releases.
In this showcase I have put together over 30 different jQuery plugins worth a mention to all web developers. Developing a website interface can be tough and certainly requires careful precision. Developing on top of any open source project means that you are not reinventing the wheel. Plus you’re not the only one left to catch bugs in the code. And since jQuery is one of the most stable JavaScript libraries available, these plugins often work hand-in-hand to provide a seamless user experience.
June 4th, 2013