Question

I love the effect that the initial smoothHeight has when the page loads.
I hate the way it slowly reacts to a page resizing after the initial load.
I would love to keep the effect for the initial page load, and then fall back to the default resizing without animation.
I have been chasing this for hours.
By setting the smoothHeight variable back to false at the end of the smoothHeight function itself I can switch the variable back to false after the initial animation, but this disables any resizing of the height after the initial load.
This feels like a very simple operation, but I can’t figure it out.
Thanks ahead of time for any ideas!

Basically, when this block is executed once, it sets the height so that, even once the variable is changed back to false, the height is no longer flexible.

smoothHeight: function(dur) {
if (!vertical || fade) {
var $obj = (fade) ? slider : slider.viewport;
(dur) ? $obj.animate({"height": slider.slides.eq(slider.animatingTo).height()}, dur) : $obj.height(slider.slides.eq(slider.animatingTo).height());
}
}

Answer 1

This seems to have done it, I set the smoothHeight variable back to “false” at the beginning of the resize function, so that after the initial page load it won’t try to animate height on resize. Then, I set the slider.viewport height to “100%” in the resize function, which resets the height and from then on resizing the page acts responsively 🙂
Last but not least, I added the resetHeight boolean variable to the top of the script that is set to false when resize runs for the first time, so that it doesnt waste resources setting the viewport height to 100% every time the page is resized.

resize: function() {
if(resetHeight) {
slider.viewport.height("100%");
resetHeight=false;}
if (!slider.animating && slider.is(':visible')) { if (!carousel) slider.doMath(); if (fade) { // SMOOTH HEIGHT: methods.smoothHeight(); } else if (carousel) { //CAROUSEL: slider.slides.width(slider.computedW); slider.update(slider.pagingCount); slider.setProps(); } else if (vertical) { //VERTICAL: slider.viewport.height(slider.h); slider.setProps(slider.h, "setTotal"); } else {
// SMOOTH HEIGHT:
if (vars.smoothHeight) methods.smoothHeight(); slider.newSlides.width(slider.computedW); slider.setProps(slider.computedW, "setTotal"); } } }, smoothHeight: function(dur) { if (!vertical || fade) { var $obj = (fade) ? slider : slider.viewport; (dur) ? $obj.animate({"height": slider.slides.eq(slider.animatingTo).height()}, dur) : $obj.height(slider.slides.eq(slider.animatingTo).height()); } },