Tag: jQuery

All PostsjQueryTutorials

Tutorial: How To Build Input Fields with Tag-Style Item Blocks

Many newer social media communities and web applications are pushing the boundaries of interface design. Form inputs have changed a lot over just the past 4-5 years. One such feature is the tag select input field, where users can enter tags which appear as block items within the field itself.

For this tutorial I want to demonstrate how we can build this effect to be used in any website. To save time I’ll be using the jQuery Tags Input Plugin which is free and open source to use on any project. I prefer this plugin over some others because of the many parameters and options for customizing the experience. Take a peek at my live demo to see what we will be creating.

Read More
10 Useful jQuery Video & Audio Players
All PostsjQuery

10 Useful jQuery Video & Audio Players

Using a custom skinned jQuery audio/video player in your website is often more aesthetically pleasing then simply embedding a video from a third party website on your website.

Being able to use a custom designed jQuery player also enables you to pair the design with your branding and design.

Within the new WordPress 3.6 there is also native support for audio and video post type. With this in mind I wanted to explore the various jQuery plugins available that will allow me to enhance the UI when using audio and video within a website.

Read More
All PostsTutorialsWeb Design

CSS3 Animated Image Slideshows with Flux Slider

There are so many JavaScript image slideshow plugins out on the Internet, it can be difficult pinpointing what you need. Developers who are not looking to start from scratch often search the web targeting the perfect solution. And although each technique has its drawbacks, the wide assortment of choices will offer plenty of rewards and something to fit your layout.

In this tutorial I want to focus on using a library called Flux Slider which was created by Joe Lambert. This image slideshow plugin is unique in that it defaults to using CSS3 transitions with JavaScript-controlled alternatives. All modern CSS3-compliant browsers will support the native features which can be set using jQuery or Zepto.js as the core library. Catch a glimpse of the demo we are building in my live example below.

Read More
How To Create Unique jQuery-Based Tooltips

How To Create Unique jQuery-Based Tooltips

Tooltip libraries are fairly common amongst the open source community. A quick Google search will net you a series of results which you could apply into any typical project. However it can be difficult figuring out some of the various options for customization. Or even the decision for which library to use can be a…

Read More
A Guide To Retina Graphics Your WordPress Theme
All PostsTutorialsWordPress

A Guide To Retina Graphics For Your WordPress Theme

With the release of the retina screen by Apple it would seem the future is a very high resolution one, with more and more users slowly using a retina or high resolution device to browse the web on it would seem the retina device is the future. With this in mind, its pretty important to understand how to create retina graphics and how to implement them on your WordPress site.

In this article I am focusing on the use of retina graphics within your WordPress website.

Read More
All PostsjQueryPhotographyWeb Design

10 Handy jQuery Instagram Plugins

Instagram is arguably one of the most popular photo sharing social networks, boasting over 30 million active users happily snapping away. With this in mind its only logical that users may want to display their photos on their own website.

In this post I wanted to focus on jQuery plugins that will enable you to pull in your own Instagram pictures, I have included a selection of jQuery Instagram plugins that you can use on WordPress, Drupal and if your not using a CMS I have also included jQuery plugins that you can use directly on your site.

Read More