The current state of select boxes on the web are just plain ugly and limited in functionality. We wanted to create a select box plugin that could be fully customizable in appearance for one. And secondly we wanted to be able to add little icons to our select box options to make them stand out and really look polished. In the end we came up with this modern looking select box plugin that does just that. It’s sleek, elegant and lightweight, and takes select boxes to the next level. Read Full Article
mousestop event was when I was building my jQuery Tooltip Plugin. I was attempting to closely mimic the browsers default behavior and noticed that the
title tooltip that appears on elements only comes after the mouse stops moving. I wanted to create this for my tooltip as well so I ended up writing this simple little
mousestop event plugin for jQuery. It takes advantage of the jQuery Special Events API which allows you to add events right into the fabric of jQuery. This means we can bind the events using
bind as well as trigger it using
trigger or calling
mousestop on an element. Read Full Article
Today I came across an error while I was linting my Intelligent RGB / HEX Converter Plugin code about requiring a
radix value for
parseInt(). After a quick look up on Google I could see that excluding this parameter could lead to some rather nasty bugs in your code. The
radix parameter is meant to specify the number system to use when parsing the value passed into
parseInt(). So if we pass in a value of 16 then the number system used would be hexadecimal and a value of 8 would be octal.
The reason why this value is important is because in older web browsers like ie7 and ie8 any value with a leading zero automatically gets parsed as an octal value. So if you happened to pass in a string of
012 this would actually get parsed as the octal value 10. Read Full Article
I find that the appearance of
checkbox inputs has always been limited. Some browsers have allowed some modification of these elements but for the most part it’s quite difficult to get them to look good and fit in with more colorful designs. We decided to make this plugins to give more flexibility to the appearance of these input elements. We wanted to be able to have more selector graphics than just a round circle dot for options and a checkmark for checkboxes. Maybe I want an “x” or some kind of triangle shape. Why should we be limited. Read Full Article
Character Counters have always bothered me during development as I was never able to find a good place for them. Sometimes I had forms with multiple inputs and having a little character counter bubble above each one just made the form look bloated and messy. Trying to make it look pretty was always too much of an effort and required a bunch of extra ugly CSS as well that I never really liked. Most of the time the CSS wasn’t even reusable as each form required a little bit of a modification to make the character counter look well with the other field on the form. I had played with some character counter ideas before but ultimately I came up with this plugin that I have been quite satisfied with. It’s a little bubble that only appears when you type and then nicely fades out when you stop typing in that
textarea input. It’s nice and elegant, and requires no more CSS, just drop in the plugin and go. Read Full Article
It’s not very often I need an rgb / hex converter in my apps or to convert a color code quickly, but when I do I find there are never any good tools around to do it quickly. In fact typing in either “rgb to hex converter” or “hex to rgb converter” into Google yields results for sites that have really crappy converters that make you type in each
I have never really gotten into using Grunt, but once I got it going I found out how great it is at automating so many tasks like linting, testing and minifying my files. I actually came across it because I was trying to update one of my projects that had Grunt setup by someone else and so I tried to get it working locally. This led me to a lot of head scratching and confusion as apparently since version 0.4 of Grunt a few things had changed, however once I got everything working it was actually quite simple.
I was not able to find a simple concise guide on setting up Grunt as most of the information was quite scattered so I decided to write this little top to bottom guide. Grunt is actually a great tool and very easy to use. It will also save you lots of time fixing bugs and trying to manually do things like linting or minifying. I hope this guide will encourage you to setup Grunt for your project, so without further adieu. Read Full Article
Great video with Steve Jobs reflecting on what is most important in life. This is a great quote that really caught my attention.
Everything around you that you call life was made up by people who were no smarter than you.
It’s true in a sense when you think about it. Only a few hundred hears ago people weren’t nearly as educated or had access to the sorts of information we have today. Yet they managed to build the modern world we live in. This really blows any sense of inferiority you may have about yourself and replaces it with only excuses. Read Full Article
This is an awesome little plugin that I just came across recently that creates a flip animation on virtually any element on your screen. It’s a very small file size and very easy to use. Most of the code is CSS3 however, so you will need a browser that supports the features for the flipping. I’ve seen plugins like this before, but usually it’s only on
div elements which have to be setup a certain way. This one is pretty slick though and allows you to add some nice eye candy to your apps. Read Full Article
After a bit of a break from Websanova we’re finally back with a redesign and some new plugins which we will be showcasing in the following week. It’s been a long time since we’ve made any design tweaks to the site and it was starting to look very old and outdated. We’ve made tons of changes both on the surface and behind the scenes in the hope to make the blog easier to read and more accessible on a variety of platforms. We also wanted to streamline our processes so that we can focus more on posting and writing articles rather than worrying about little details on the back end. With that here are some key highlights along with some before and after shots. Read Full Article