Wednesday, November 18th, 2009

Simply Buttons

Category: JavaScript, Library

<>p>Kevin Miller has updated his simply buttons library to use the button element. This library offers better looking and behaving buttons across all browsers. It does not need a javascript framework and is very easy to install and use.

simplybuttons

It is all the rage to build a perfect button and you can get some nice ones via SimplyButtons.init()

Related Content:

17 Comments »

Comments feed TrackBack URI

Too bad the script itself is rather poor (http://www.p51labs.com/projects/buttons/javascripts/SimplyButtons.js): tests for presence of class the wrong way (using boundaries), uses getAttribute/setAttribute to copy intrinsic event properties (!), wastes memory by creating unnecessary array objects in a loop (which could be created once), uses `attachEvent` after sniffing for `document.all`, etc…

Comment by kangax — November 18, 2009

Has anyone seen any usability studies about what type of cursor to use for buttons/links? By default, buttons and input=submit elements don’t use the ‘pointer’ cursor. Now that we style buttons to look like links (to facilitate POST/PUT/DELETE links, for instance) and links to look like buttons, is there a best practice for which cursor to use?

Comment by posaune — November 18, 2009

@kangax, uh-oh, I think you scared him away, the link to the JS is dead.

Comment by RyanMorr — November 18, 2009

@RyanMorr looks like kangax’s link has a trailing ) that shouldn’t be in the link.

Comment by blepore — November 18, 2009

@blepore, my bad I didn’t notice that. Maybe it’s for the best, I almost threw up in my mouth when I saw the code kangax was eluding to.

Comment by RyanMorr — November 18, 2009

They are pretty, though. :-)

Comment by Nosredna — November 18, 2009

Only on Ajaxian ;). Articles about hardcore JavaScript optimization one day, and then an article about a crappy “button library” the next.

Comment by parsap — November 18, 2009

Well, one good thing came out of this. There is no reason for javascript to be involved in buttons. Fortunately, the nice gentleman who stole the button design posted a link to a page where that design is implemented with just images and CSS: http://www.oscaralexander.com/tutorials/how-to-make-sexy-buttons-with-css.html

Comment by MaratDenenberg — November 18, 2009

Those are some nice Web 2.0 buttons. However, I’m currently on Web 3.1., so they are too dated looking for me to use.

Comment by WillPeavy — November 18, 2009

Hi-

Thanks for everyones feedback, that’s what I am always looking for. I would like to address a few things though.

@kangax and the likes: Thank you for being so childish, next time please offer up some suggestions for improvement. This JS is not necessary and is the first version without a framework.

@MaratDenenberg: I did not steal the design, in fact I link to oscar. More over the buttons are generic and are to show off the technique, its not like I stole the youtube buttons as well.

Once again thanks for the feedback guys, this is how we get new generations of code out there that work better than the last.

Kevin

Comment by p51labs — November 18, 2009

@p51labs Childish, huh :) Didn’t I list few things that were out of place? Is that not a suggestion?

Comment by kangax — November 18, 2009

@p51labs – good sportsmanship is completely ignoring all criticism. good coding is accepting informed criticism with grace… :P

Comment by sixtyseconds — November 18, 2009

My bad guys and my apologies to kangax, I read all the comments at once and clumped kangax with RyanMorr and some others.

@kangax: Thanks for the pointers, I already have a list of todo’s for the JS end and it will only get better from here :)

@sixtyseconds: I love that quote, who is it from? I agree, constructive comments are always the best, that’s how things get better ;)

Kevin

Comment by p51labs — November 18, 2009

it’s from me :D

Comment by sixtyseconds — November 19, 2009

@MaratDenenberg: You do realize that the page you linked to also requires JS to be cross-browser, right?

Comment by zulugrid — November 19, 2009

@zulugrid: HAHA :) Just goes to show ya that there are people that prefer to knock something before they actually read…

Comment by p51labs — November 19, 2009

Quite nice. But fixed height, not scalable. What if someone wants paw-sized buttons for a touchscreen app?

Comment by ExtAnimal — November 25, 2009

Leave a comment

You must be logged in to post a comment.