Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP

Loading…

Fix for label animation loop #15

Merged
merged 1 commit into from

2 participants

@Francisc

Hello,

I've added a call to stop() before animate() so that if you quickly switch between fields or press and hold the TAB key, labels won't keep moving around long after interaction finished.

@remybach remybach merged commit 69d458c into remybach:master
@remybach
Owner

What a genuinely useful pull request (you even updated the minified file)!

Thank you very much!

@Francisc

Thanks, Remy.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Commits on Sep 28, 2012
  1. @Francisc
This page is out of date. Refresh to see the latest.
Showing with 4 additions and 4 deletions.
  1. +3 −3 jquery.superLabels.js
  2. +1 −1  jquery.superLabels.min.js
View
6 jquery.superLabels.js
@@ -177,7 +177,7 @@
_duration = defaults.fadeDuration;
}
- _label.animate(_to, _duration, defaults.easingOut);
+ _label.stop(true,false).animate(_to, _duration, defaults.easingOut);
}
};
_blur = function() {
@@ -197,7 +197,7 @@
_duration = defaults.fadeDuration;
}
- _label.animate(_to, _duration, defaults.easingOut);
+ _label.stop(true,false).animate(_to, _duration, defaults.easingOut);
} else {
// If there is a value, and the label is visible, fire our _keyup function so as to hide it. (this semi-fixes the autofill bug)
_keyup.apply(this);
@@ -220,7 +220,7 @@
_o = defaults.opacity;
}
- _label.animate({ opacity:_o }, defaults.fadeDuration, defaults.easingOut);
+ _label.stop(true,false).animate({ opacity:_o }, defaults.fadeDuration, defaults.easingOut);
};
/*===== Utility Functions =====*/
View
2  jquery.superLabels.min.js
@@ -7,4 +7,4 @@
* Description:
* This plugin allows you to display your form labels on top of your form fields, saving you space on your page.
*/
-(function(a){var b={baseZindex:0,duration:500,easingIn:a.easing.def?"easeInOutCubic":false,easingOut:a.easing.def?"easeInOutCubic":false,fadeDuration:250,labelLeft:0,labelTop:0,noAnimate:false,opacity:.5,slide:true,wrapSelector:false};var c=["text","search","url","tel","email","password","number"];var d=["input","textarea","select"];a.fn.superLabels=function(e){var f=[];if(this.length===0)return false;if(e&&e.labelLeft&&isNaN(e.labelLeft))e.labelLeft=Number(e.labelLeft.replace(/\D+/,""));if(e&&e.labelTop&&isNaN(e.labelTop))e.labelTop=Number(e.labelTop.replace(/\D+/,""));a.extend(b,e||{});if(this.length===1&&/form/i.test(this[0].tagName)){f=a(d.join(","),this)}else if(this.length>1){this.each(function(){if(/form/i.test(this.tagName)){a.merge(f,a(d.join(","),this))}else{f.push(this)}})}else{f=this}return a(f).each(function(){var b=a(this);if((b[0].tagName.toLowerCase()==="input"&&a.inArray(b.attr("type"),c))===-1&&a.inArray(b[0].tagName.toLowerCase(),d)!==-1){return true}var e=_getLabel(this);var f=b.attr("placeholder");if(f){if(e.length===0){var g='<label for="'+(b.attr("id")||b.attr("name"))+'">'+f+"</label>";g+="</label>";g=a(g);e=g;b.before(e)}else{e.attr("title",f)}b.removeAttr("placeholder")}if(e.length===0){return true}_prepLabel(b,e);if(!this.tagName.match(/select/i)){b.focus(_focus);b.blur(_blur);b.change(_blur);b.bind("input",_keyup);b.bind("propertychange",_blur);b.keyup(_keyup);e.click(function(){b.focus()})}})};_getLabel=function(c){var d=a(c).siblings("label");if(d.length===0){if(b.wrapSelector){d=a(c).parents(b.wrapSelector).find("label")}else{_for=c.id||c.name;d=a('[for="'+_for+'"]')}}return d};_prepLabel=function(c,d){if(c[0].tagName.match(/select/i)){var e=c.find("[selected]").length===0?" selected":"";c.prepend('<option value="" disabled'+e+' rel="label">'+d.html()+"</option>");d.css("display","none")}else{c.css({zIndex:b.baseZindex+1}).addClass("sl_field");d.css({left:_noVal(c)?b.labelLeft:a(c).width()-d.width(),opacity:_noVal(c)?1:0,position:"absolute",top:b.labelTop,zIndex:b.baseZindex+2}).addClass("sl_label")}};_focus=function(){if(_noVal(this)){var c=b.duration;var d=_getLabel(this);var e={opacity:0};if(b.noAnimate){d.hide();return false}if(b.slide){e.left=a(this).width()-d.width();e.opacity=b.opacity}else{c=b.fadeDuration}d.animate(e,c,b.easingOut)}};_blur=function(){if(_noVal(this)){var a=b.duration;var c=_getLabel(this);var d={opacity:1};if(b.noAnimate){c.show();return false}if(b.slide){d.left=b.labelLeft}else{a=b.fadeDuration}c.animate(d,a,b.easingOut)}else{_keyup.apply(this)}};_keyup=function(){if(b.noAnimate)return false;var a=_getLabel(this);var c=0;if(_noVal(this)&&a.css("opacity")>0||!_noVal(this)&&a.css("opacity")===0){return false}if(_noVal(this)&&a.css("opacity")!==0){c=b.opacity}a.animate({opacity:c},b.fadeDuration,b.easingOut)};_noVal=function(b){return a(b).val()===""}})(jQuery)
+(function(a){var b={baseZindex:0,duration:500,easingIn:a.easing.def?"easeInOutCubic":false,easingOut:a.easing.def?"easeInOutCubic":false,fadeDuration:250,labelLeft:0,labelTop:0,noAnimate:false,opacity:.5,slide:true,wrapSelector:false};var c=["text","search","url","tel","email","password","number"];var d=["input","textarea","select"];a.fn.superLabels=function(e){var f=[];if(this.length===0)return false;if(e&&e.labelLeft&&isNaN(e.labelLeft))e.labelLeft=Number(e.labelLeft.replace(/\D+/,""));if(e&&e.labelTop&&isNaN(e.labelTop))e.labelTop=Number(e.labelTop.replace(/\D+/,""));a.extend(b,e||{});if(this.length===1&&/form/i.test(this[0].tagName)){f=a(d.join(","),this)}else if(this.length>1){this.each(function(){if(/form/i.test(this.tagName)){a.merge(f,a(d.join(","),this))}else{f.push(this)}})}else{f=this}return a(f).each(function(){var b=a(this);if((b[0].tagName.toLowerCase()==="input"&&a.inArray(b.attr("type"),c))===-1&&a.inArray(b[0].tagName.toLowerCase(),d)!==-1){return true}var e=_getLabel(this);var f=b.attr("placeholder");if(f){if(e.length===0){var g='<label for="'+(b.attr("id")||b.attr("name"))+'">'+f+"</label>";g+="</label>";g=a(g);e=g;b.before(e)}else{e.attr("title",f)}b.removeAttr("placeholder")}if(e.length===0){return true}_prepLabel(b,e);if(!this.tagName.match(/select/i)){b.focus(_focus);b.blur(_blur);b.change(_blur);b.bind("input",_keyup);b.bind("propertychange",_blur);b.keyup(_keyup);e.click(function(){b.focus()})}})};_getLabel=function(c){var d=a(c).siblings("label");if(d.length===0){if(b.wrapSelector){d=a(c).parents(b.wrapSelector).find("label")}else{_for=c.id||c.name;d=a('[for="'+_for+'"]')}}return d};_prepLabel=function(c,d){if(c[0].tagName.match(/select/i)){var e=c.find("[selected]").length===0?" selected":"";c.prepend('<option value="" disabled'+e+' rel="label">'+d.html()+"</option>");d.css("display","none")}else{c.css({zIndex:b.baseZindex+1}).addClass("sl_field");d.css({left:_noVal(c)?b.labelLeft:a(c).width()-d.width(),opacity:_noVal(c)?1:0,position:"absolute",top:b.labelTop,zIndex:b.baseZindex+2}).addClass("sl_label")}};_focus=function(){if(_noVal(this)){var c=b.duration;var d=_getLabel(this);var e={opacity:0};if(b.noAnimate){d.hide();return false}if(b.slide){e.left=a(this).width()-d.width();e.opacity=b.opacity}else{c=b.fadeDuration}d.stop(true,false).animate(e,c,b.easingOut)}};_blur=function(){if(_noVal(this)){var a=b.duration;var c=_getLabel(this);var d={opacity:1};if(b.noAnimate){c.show();return false}if(b.slide){d.left=b.labelLeft}else{a=b.fadeDuration}c.stop(true,false).animate(d,a,b.easingOut)}else{_keyup.apply(this)}};_keyup=function(){if(b.noAnimate)return false;var a=_getLabel(this);var c=0;if(_noVal(this)&&a.css("opacity")>0||!_noVal(this)&&a.css("opacity")===0){return false}if(_noVal(this)&&a.css("opacity")!==0){c=b.opacity}a.stop(true,false).animate({opacity:c},b.fadeDuration,b.easingOut)};_noVal=function(b){return a(b).val()===""}})(jQuery)
Something went wrong with that request. Please try again.