Jul
21
2010
Blind Toggle for jQuery
jQuery has a great slide effect which comes built in to the core code. The only problem is that when an element slides down, it starts from the top and slides down to the bottom. Check out the drop down menu on Moderno to see what I mean.
I wanted to create an element that slides out from the bottom up and came across this piece of jQuery code which creates a “blind” toggle.
jQuery.fn.blindToggle = function(speed, easing, callback) { var h = this.height() + parseInt(this.css('paddingTop')) + parseInt(this.css('paddingBottom')); return this.animate({marginTop: parseInt(this.css('marginTop')) <0 ? 0 : -h}, speed, easing, callback); }; |
I have included it in my upcoming Premium theme Elemental Portfolio and I wanted to give props to Karl Swedberg on Learning jQuery for pointing me in the right direction.