diff --git a/build/jquery.steps.js b/build/jquery.steps.js index 99ca096..0bda165 100644 --- a/build/jquery.steps.js +++ b/build/jquery.steps.js @@ -1011,6 +1011,12 @@ function render(wizard, options, state) refreshStepNavigation(wizard, options, state); renderPagination(wizard, options, state); + + // Set the initial and min height of body content + var initialHeight = wizard.find(".body.current").outerHeight(true), + minHeight = wizard.find(".steps ul[role='tablist']").height(); + if (orientation) wizard.find(".content").css("min-height", minHeight + "px"); + wizard.find(".content").css("height", initialHeight + "px"); } /** @@ -1218,6 +1224,7 @@ function startTransitionEffect(wizard, options, state, index, oldIndex) case transitionEffect.slideLeft: var outerWidth = currentStep.outerWidth(true), + outerHeight = newStep.outerHeight(false), posFadeOut = (index > oldIndex) ? -(outerWidth) : outerWidth, posFadeIn = (index > oldIndex) ? outerWidth : -(outerWidth); @@ -1225,6 +1232,7 @@ function startTransitionEffect(wizard, options, state, index, oldIndex) function () { $(this)._showAria(false); }).promise(); newStep.css("left", posFadeIn + "px")._showAria() .animate({ left: 0 }, effectSpeed).promise(); + currentStep.parent().animate({"height": outerHeight+"px"},options.transitionEffectSpeed); break; default: @@ -2012,4 +2020,4 @@ var defaults = $.fn.steps.defaults = { loading: "Loading ..." } }; -})(jQuery); \ No newline at end of file +})(jQuery); diff --git a/demo/css/jquery.steps.css b/demo/css/jquery.steps.css index ad9f1c1..c4bf591 100644 --- a/demo/css/jquery.steps.css +++ b/demo/css/jquery.steps.css @@ -142,7 +142,7 @@ background: #eee; display: block; margin: 0.5em; - min-height: 35em; + /*min-height: 35em;*/ overflow: hidden; position: relative; width: auto; @@ -165,7 +165,7 @@ float: left; position: absolute; width: 95%; - height: 95%; + /*height: 95%;*/ padding: 2.5%; } @@ -379,4 +379,4 @@ .tabcontrol > .content > .body ul > li { display: list-item; -} \ No newline at end of file +} diff --git a/demo/vertical.html b/demo/vertical.html index 7dd2e94..ffe7cb3 100644 --- a/demo/vertical.html +++ b/demo/vertical.html @@ -50,37 +50,31 @@

Basic Demo

First Step

-
-

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer ut nulla nunc. Maecenas arcu sem, hendrerit a tempor quis, - sagittis accumsan tellus. In hac habitasse platea dictumst. Donec a semper dui. Nunc eget quam libero. Nam at felis metus. - Nam tellus dolor, tristique ac tempus nec, iaculis quis nisi.

-
- -

Second Step

-
-

Donec mi sapien, hendrerit nec egestas a, rutrum vitae dolor. Nullam venenatis diam ac ligula elementum pellentesque. - In lobortis sollicitudin felis non eleifend. Morbi tristique tellus est, sed tempor elit. Morbi varius, nulla quis condimentum - dictum, nisi elit condimentum magna, nec venenatis urna quam in nisi. Integer hendrerit sapien a diam adipiscing consectetur. - In euismod augue ullamcorper leo dignissim quis elementum arcu porta. Lorem ipsum dolor sit amet, consectetur adipiscing elit. - Vestibulum leo velit, blandit ac tempor nec, ultrices id diam. Donec metus lacus, rhoncus sagittis iaculis nec, malesuada a diam. - Donec non pulvinar urna. Aliquam id velit lacus.

-
- -

Third Step

-
-

Morbi ornare tellus at elit ultrices id dignissim lorem elementum. Sed eget nisl at justo condimentum dapibus. Fusce eros justo, - pellentesque non euismod ac, rutrum sed quam. Ut non mi tortor. Vestibulum eleifend varius ullamcorper. Aliquam erat volutpat. - Donec diam massa, porta vel dictum sit amet, iaculis ac massa. Sed elementum dui commodo lectus sollicitudin in auctor mauris - venenatis.

-
- -

Forth Step

-
-

Quisque at sem turpis, id sagittis diam. Suspendisse malesuada eros posuere mauris vehicula vulputate. Aliquam sed sem tortor. - Quisque sed felis ut mauris feugiat iaculis nec ac lectus. Sed consequat vestibulum purus, imperdiet varius est pellentesque vitae. - Suspendisse consequat cursus eros, vitae tempus enim euismod non. Nullam ut commodo tortor.

-
+
+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus in elementum augue. Donec quis nisi dignissim, adipiscing justo in, ultricies lacus. Pellentesque varius ullamcorper nibh, quis mattis massa fermentum in. Phasellus sed turpis in magna interdum adipiscing. Morbi ac commodo nisl. Duis eu nisi a sem pretium tristique vel sed mi. Etiam ut dui sem. Mauris tristique a nisi sit amet varius. Aenean pharetra tellus ac libero tempor vestibulum. Morbi consectetur velit vitae orci congue, facilisis ornare tortor mattis. Nam enim erat, ornare nec eros in, cursus facilisis velit. Sed commodo, justo eget vehicula viverra, risus lorem consequat lorem, sed vulputate purus purus in tortor. Donec ac interdum leo. Proin porttitor dignissim odio, id pellentesque mauris placerat vulputate. In vulputate tempor elementum. Suspendisse aliquam pharetra lorem, id blandit elit suscipit nec.

+

In cursus laoreet nibh sed molestie. Proin felis nunc, semper ut luctus ut, dapibus at velit. Duis rutrum laoreet nunc sagittis fringilla. Nulla dolor ipsum, tincidunt vel laoreet eget, convallis nec leo. Donec hendrerit nisl at sodales dictum. Curabitur eu purus a urna ullamcorper elementum ac ac lorem. Suspendisse potenti. Proin tellus eros, mattis ut laoreet id, dapibus non lorem. Suspendisse dui nisi, consectetur porttitor rhoncus varius, rhoncus in mauris. Nam non tristique libero.

+

Vestibulum at ante ac lectus luctus facilisis at vitae magna. Phasellus auctor malesuada nisl mollis mattis. Nullam id porta dui. Praesent ac odio quis sapien hendrerit pellentesque a ac nisl. Aenean volutpat sapien purus, vel molestie est aliquet eget. Donec aliquam volutpat posuere. Praesent id lorem nisl. Cras ac scelerisque libero. Quisque sed tellus sagittis augue pharetra facilisis ut sit amet lectus. Cras non ante posuere, sagittis felis sit amet, eleifend odio.

+

Morbi libero tellus, vulputate quis nulla vel, ultrices pulvinar ante. Donec tristique sapien vitae consectetur luctus. Quisque rutrum ligula nulla, eget convallis est vulputate id. Curabitur porta ante a lacus egestas, vel elementum lectus suscipit. Maecenas sit amet turpis dictum, dapibus tellus ut, tempor quam. Vestibulum semper magna vel massa consequat faucibus et a ipsum. Pellentesque eget lacus ut magna venenatis molestie quis mollis libero. Donec vitae eleifend eros. Quisque dui nisl, scelerisque a volutpat ut, dignissim vitae sapien. Duis at vulputate odio. Duis condimentum velit erat, sed malesuada eros hendrerit eu. Proin sollicitudin a quam non eleifend. Donec molestie purus tincidunt, rhoncus justo quis, pharetra tellus. Nam in luctus augue.

+
+ +

Second Step

+
+

Donec mi sapien, hendrerit nec egestas a, rutrum vitae dolor. Nullam venenatis diam ac ligula elementum pellentesque. In lobortis sollicitudin felis non eleifend. Morbi tristique tellus est, sed tempor elit. Morbi varius, nulla quis condimentum dictum, nisi elit condimentum magna, nec venenatis urna quam in nisi. Integer hendrerit sapien a diam adipiscing consectetur. In euismod augue ullamcorper leo dignissim quis elementum arcu porta. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum leo velit, blandit ac tempor nec, ultrices id diam. Donec metus lacus, rhoncus sagittis iaculis nec, malesuada a diam. Donec non pulvinar urna. Aliquam id velit lacus.

+
+ +

Third Step

+
+

Morbi ornare tellus at elit ultrices id dignissim lorem elementum. Sed eget nisl at justo condimentum dapibus. Fusce eros justo, pellentesque non euismod ac, rutrum sed quam. Ut non mi tortor. Vestibulum eleifend varius ullamcorper. Aliquam erat volutpat. Donec diam massa, porta vel dictum sit amet, iaculis ac massa. Sed elementum dui commodo lectus sollicitudin in auctor mauris venenatis.

+
+ +

Forth Step

+
+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus in elementum augue. Donec quis nisi dignissim, adipiscing justo in, ultricies lacus. Pellentesque varius ullamcorper nibh, quis mattis massa fermentum in. Phasellus sed turpis in magna interdum adipiscing. Morbi ac commodo nisl. Duis eu nisi a sem pretium tristique vel sed mi. Etiam ut dui sem. Mauris tristique a nisi sit amet varius. Aenean pharetra tellus ac libero tempor vestibulum. Morbi consectetur velit vitae orci congue, facilisis ornare tortor mattis. Nam enim erat, ornare nec eros in, cursus facilisis velit. Sed commodo, justo eget vehicula viverra, risus lorem consequat lorem, sed vulputate purus purus in tortor. Donec ac interdum leo. Proin porttitor dignissim odio, id pellentesque mauris placerat vulputate. In vulputate tempor elementum. Suspendisse aliquam pharetra lorem, id blandit elit suscipit nec.

+

In cursus laoreet nibh sed molestie. Proin felis nunc, semper ut luctus ut, dapibus at velit. Duis rutrum laoreet nunc sagittis fringilla. Nulla dolor ipsum, tincidunt vel laoreet eget, convallis nec leo. Donec hendrerit nisl at sodales dictum. Curabitur eu purus a urna ullamcorper elementum ac ac lorem. Suspendisse potenti. Proin tellus eros, mattis ut laoreet id, dapibus non lorem. Suspendisse dui nisi, consectetur porttitor rhoncus varius, rhoncus in mauris. Nam non tristique libero.

+

Vestibulum at ante ac lectus luctus facilisis at vitae magna. Phasellus auctor malesuada nisl mollis mattis. Nullam id porta dui. Praesent ac odio quis sapien hendrerit pellentesque a ac nisl. Aenean volutpat sapien purus, vel molestie est aliquet eget. Donec aliquam volutpat posuere. Praesent id lorem nisl. Cras ac scelerisque libero. Quisque sed tellus sagittis augue pharetra facilisis ut sit amet lectus. Cras non ante posuere, sagittis felis sit amet, eleifend odio.

+

Morbi libero tellus, vulputate quis nulla vel, ultrices pulvinar ante. Donec tristique sapien vitae consectetur luctus. Quisque rutrum ligula nulla, eget convallis est vulputate id. Curabitur porta ante a lacus egestas, vel elementum lectus suscipit. Maecenas sit amet turpis dictum, dapibus tellus ut, tempor quam. Vestibulum semper magna vel massa consequat faucibus et a ipsum. Pellentesque eget lacus ut magna venenatis molestie quis mollis libero. Donec vitae eleifend eros. Quisque dui nisl, scelerisque a volutpat ut, dignissim vitae sapien. Duis at vulputate odio. Duis condimentum velit erat, sed malesuada eros hendrerit eu. Proin sollicitudin a quam non eleifend. Donec molestie purus tincidunt, rhoncus justo quis, pharetra tellus. Nam in luctus augue.

+
- \ No newline at end of file +