preview pages: get rid of content jumps when subnav -> subnav-fixed

diff --git a/css/bootswatch.css b/css/bootswatch.css
index 3783d9d..229e496 100644 (file)
--- a/css/bootswatch.css
+++ b/css/bootswatch.css
@@ -24,6 +24,10 @@ section {
        font-size: 54px;
 }
 
+.subhead > div:first-child {
+       min-height: 200px;
+}
+
 .subnav {
        margin-bottom: 60px;
        width: 100%;

diff --git a/js/application.js b/js/application.js
index cd7cf0c..8daeebf 100755 (executable)
--- a/js/application.js
+++ b/js/application.js
@@ -4,9 +4,12 @@
 
                // fix sub nav on scroll
                var $win = $(window),
+                               $body = $('body'),
                                $nav = $('.subnav'),
                                navHeight = $('.navbar').first().height(),
-                               navTop = $('.subnav').length && $('.subnav').offset().top - navHeight,
+                               subnavHeight = $('.subnav').first().height(),
+                               subnavTop = $('.subnav').length && $('.subnav').offset().top - navHeight,
+                               marginTop = parseInt($body.css('margin-top'), 10);
                                isFixed = 0;
 
                processScroll();
@@ -15,12 +18,15 @@
 
                function processScroll() {
                        var i, scrollTop = $win.scrollTop();
-                       if (scrollTop >= navTop && !isFixed) {
+
+                       if (scrollTop >= subnavTop && !isFixed) {
                                isFixed = 1;
                                $nav.addClass('subnav-fixed');
-                       } else if (scrollTop <= navTop && isFixed) {
+                               $body.css('margin-top', marginTop + subnavHeight + 'px');
+                       } else if (scrollTop <= subnavTop && isFixed) {
                                isFixed = 0;
                                $nav.removeClass('subnav-fixed');
+                               $body.css('margin-top', marginTop + 'px');
                        }
                }