Custom AddThis share button

July 29
2010
in JavaScript

I wanted to have an AddThis share but­ton that would fit bet­ter with the site’s design, and if you’re read­ing this post on its own page you can scroll down and see what I mean. While AddThis pro­vides plenty of ways to cus­tomize their but­tons, there is no way to assign your own image to the icon, which means doing it the hard way… well, rel­a­tively speak­ing of course.

There are three main steps to cre­at­ing a cus­tomized share but­ton. There’s some javascript to include in the footer.php, few lines of html to add at the end of your posts, and of course some styles and the icon itself.
Keep Reading

Leave a comment

Simple jQuery placeholder script for input fields

March 8
2010
in JavaScript

Placeholder is a very use­ful attribute of the <input> tag that is spec­i­fied in the HTML5 spec. It pro­vides a text that goes into the field, by default, and is used as a kind of a quick tip for the user about what they should type into the field, such as “type to search”, or “type in user­name”. The nice thing about “place­holder”, as oppose to, for exam­ple, sim­ply set­ting some value for the field, is that it auto­mat­i­cally dis­ap­pears when the user starts typ­ing some­thing in, but it reap­pears if the user ends up leav­ing the field empty. Unfortunately this attribute, and its func­tion­al­ity, is actu­ally not sup­ported by most browsers, includ­ing Firefox 3.6 and IE8, it is how­ever sup­ported by Chrome 4, and pos­si­bly Safari 4 though I can’t vouch for the latter.

I recently had a few projects that needed this func­tion­al­ity, and while some of them had email, pass­word and other fields that required val­i­da­tion, one needed just very sim­ple text fields with place­holder text. So I wrote this very sim­ple javascript func­tion, using jQuery, to do just that (I’m using jQuery 1.4.2 here). Keep Reading

Comments 3