Make the placeholder attribute work in older browsers.

This commit is contained in:
Chris Eppstein 2010-12-18 13:34:36 -08:00
parent 411adba777
commit 992eb8dcf5
2 changed files with 52 additions and 0 deletions

View File

@ -0,0 +1,51 @@
(function($) {
$.fn.replaceholder = function(options) {
var $placeholder;
(this.length > 0) ? $this = $(this) : $this = $('input[placeholder]');
return $this.each(function() {
settings = jQuery.extend({
focusColor: '#000',
blurColor: '#aaa'
}, options);
var $placeholder = $(this);
if ($placeholder.length > 0) {
var attrPh = $placeholder.attr('placeholder');
$placeholder.attr('value', attrPh);
$placeholder.css('color',settings.blurColor)
.bind('focus', function() {
var $this = $(this);
if($this.val() === attrPh)
$this.val('').css('color',settings.focusColor);
}).bind('blur', function() {
var $this = $(this);
if($this.val() === '')
$this.val(attrPh).css('color',settings.blurColor);
});
}
});
};
})(jQuery);
jQuery(function($){
$(document).ready(function(){
if (!Modernizr.input.placeholder) { $("input[placeholder], textarea[placeholder]").replaceholder() }
})
})

View File

@ -1,5 +1,6 @@
%script(src="/javascripts/modernizr-1.6.min.js" type="text/javascript") %script(src="/javascripts/modernizr-1.6.min.js" type="text/javascript")
%script(src="/javascripts/jquery-1.3.2.min.js" type="text/javascript") %script(src="/javascripts/jquery-1.3.2.min.js" type="text/javascript")
%script(src="/javascripts/jquery.cookie.js" type="text/javascript") %script(src="/javascripts/jquery.cookie.js" type="text/javascript")
%script(src="/javascripts/placeholder.js" type="text/javascript" deferred)
%script(src="/javascripts/site.js" type="text/javascript") %script(src="/javascripts/site.js" type="text/javascript")
%script(src="/javascripts/fixups.js" type="text/javascript" deferred) %script(src="/javascripts/fixups.js" type="text/javascript" deferred)