Skip to content

Instantly share code, notes, and snippets.

@solepixel
Created September 5, 2015 16:39
Show Gist options
  • Save solepixel/72c495e5e2acc2da6c78 to your computer and use it in GitHub Desktop.
Save solepixel/72c495e5e2acc2da6c78 to your computer and use it in GitHub Desktop.
jQuery(function($){
$('.gform_fields input[type="text"], .gform_fields input[type="email"], .gform_fields input[type="tel"], .gform_fields textarea').fadeLabel();
});
;(function ( $, window, document, undefined ) {
"use strict";
var pluginName = "fadeLabel",
defaults = {
label : false,
abort : false
};
// The actual plugin constructor
function Plugin ( element, options ) {
this.element = element;
this.$label = false;
this.settings = $.extend( {}, defaults, options );
this._defaults = defaults;
this._name = pluginName;
this.init();
}
// Avoid Plugin.prototype conflicts
$.extend(Plugin.prototype, {
init: function () {
this.findLabel();
if( ! this.$label.length ){
console.log( 'fadeLabel could not find a label.' );
return;
}
if( ! this.$label.text() ){
console.log( 'fadeLabel found an empty label.' );
return;
}
this.bindEvents();
},
findLabel: function () {
var lbl = this.settings.label,
$field = $(this.element),
$label = false;
// look for the settings label first
if( lbl ){
$label = $field.closest( lbl );
if( ! $label.length )
$label = $field.prev( lbl );
if( ! $label.length )
$label = $field.next( lbl );
}
// try to find a label automatically
if( ! $label.length )
$label = $field.next('label:first');
if( ! $label.length )
$label = $field.siblings('label:first');
if( ! $label.length )
$label = $field.parents('label').find('.label:first');
if( ! $label.length )
$label = $field.parents('li:first').find('label');
if( ! $label.length )
$label = $field.parents('p:first').find('label');
if( ! $label.length )
$label = $field.parents('form:first').find('label');
this.$label = $label;
},
bindEvents: function(){
var $field = $( this.element ),
$label = $( this.$label );
// hide the label if the field has a value
if( $field.val() )
$label.hide();
// setup field events
$field.focus(function(e){
if( ! $field.val() ){
$label.fadeTo( 'normal', .2 );
} else {
if( $label.css('opacity') > 0 ){
$label.fadeTo('fast', 0, function(){
$label.hide();
});
}
}
}).blur(function(e){
if( ! $field.val() ){
$label.fadeTo( 'normal', 1 );
} else {
if( $label.css('opacity') > 0 ){
$label.hide();
}
}
}).keyup(function(e){
if( $field.val() ){
if( $label.css('opacity') > 0 ){
$label.fadeTo( 'fast', 0, function(){
$label.hide();
});
}
} else {
$label.fadeTo( 'normal', .2 );
}
});
}
});
// A really lightweight plugin wrapper around the constructor,
// preventing against multiple instantiations
$.fn[ pluginName ] = function ( options ) {
return this.each(function() {
if ( !$.data( this, "plugin_" + pluginName ) ) {
$.data( this, "plugin_" + pluginName, new Plugin( this, options ) );
}
});
};
})( jQuery, window, document );
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment