Files
PetitTeton/public/js/jquery.shadowText.js

46 lines
1.3 KiB
JavaScript

//
//Notes:
//Requires that the element getting the shadow have a fixed height and width defined in the css, and that both a left and right or top and bottom reference be provided.
//
(function($) {
$.fn.buildShadowText = function() {
for(var index = 0; index < this.length; index++) {
var next = $(this[index]);
//Setup all the shadow text fields to show their shadow text when the field is empty and out of focus.//
var shadowText = next.attr('shadow-text');
var val = next.val();
if(!val || val.length == 0) {
next.data('originalColor', next.css('color'));
next.css('color', '#999');
next.data('isShowingShadowText', true);
next.val(shadowText);
}
next.focus(function() {
var next = $(this);
var isShowing = next.data('isShowingShadowText');
if(isShowing) {
next.css('color', next.data('originalColor'));
next.val("");
next.data('isShowingShadowText', false);
}
});
next.blur(function() {
var next = $(this);
var shadowText = next.attr('shadow-text');
var val = next.val();
if(!val || val.length == 0) {
next.data('originalColor', next.css('color'));
next.css('color', '#999');
next.data('isShowingShadowText', true);
next.val(shadowText);
}
});
}
return this;
}
})(jQuery);