Sticky Footer

[joewellmade]

Hi Ole, I'm currently working on our studio site: http://aa4.a8d.mwp.accessdomain.com/journal-2/

The page i've linked to shows a page where the sticky footer doesn't seem to be working. It's ok on other pages, however i'm not sure if it's conflicting with javascript on the journal page or something like that. Could you let me know if you can see what the problem is?

All the best,
Joe

[olefredrik]

Hi Joe,

Sorry for the late reply. Seems to be working fine now? Did you figure out what the problem was?

Best regards,
Ole Fredrik

[joewellmade]

Thanks Ole, it's ok on most pages, however when you click a journal
filter to filter the results by category the footer jumps up, it's ok if
you refresh the screen but not many people will do that.

http://wellmadestudio.com/well-made-studio-design-blog/
http://www.wellmadestudio.com

Ole Fredrik Lie mailto:[email protected]
10 March 2016 14:10

Hi Joe,

Sorry for the late reply. Seems to be working fine now? Did you figure
out what the problem was?

Best regards,
Ole Fredrik

—
Reply to this email directly or view it on GitHub
#674 (comment).

Sent from Postbox
https://www.postbox-inc.com/?utm_source=email&utm_medium=siglink&utm_campaign=reach

[olefredrik]

Aha. You will need to make sure the stickyfooter script is firing on hashchange or click on the filter buttons. Not quite sure how to achieve this with isotope, but it shouldn't be too difficult I guess.

[joewellmade]

Ah ok, does that mean the script needs to be fired each time the
category is selected?

Ole Fredrik Lie mailto:[email protected]
10 March 2016 14:36

Aha. You will need to make sure the stickyfooter script is firing on
hashchange or click on the filter buttons. Not quite sure how to
achieve this with isotope, but it shouldn't be too difficult I guess.

—
Reply to this email directly or view it on GitHub
#674 (comment).

Sent from Postbox
https://www.postbox-inc.com/?utm_source=email&utm_medium=siglink&utm_campaign=reach

[olefredrik]

As you can see, the script is now firing on load, resize and orientationChange. I would suggest that you add hashchange to that list. That should work. At least in theory :) Let me know how it goes.

$(window).bind(' load resize orientationChange ', function () {
   var footer = $("#footer-container");
   var pos = footer.position();
   var height = $(window).height();
   height = height - pos.top;
   height = height - footer.height() -1;

   function stickyFooter() {
     footer.css({
         'margin-top': height + 'px'
     });
   }

   if (height > 0) {
     stickyFooter();
   }
});

[joewellmade]

Brilliant, thanks Ole, will give it a go!

Ole Fredrik Lie mailto:[email protected]
10 March 2016 14:50

As you can see, the script is now firing on load, resize and
orientationChange. I would suggest that you add |hashchange| to that
list. That should work. At least in theory :) Let me know how it goes.

|$(window).bind(' load resize orientationChange ', function () {
var footer = $("#footer-container");
var pos = footer.position();
var height = $(window).height();
height = height - pos.top;
height = height - footer.height() -1;

function stickyFooter() {
footer.css({
'margin-top': height + 'px'
});
}

if (height > 0) {
stickyFooter();
}
});
|

—
Reply to this email directly or view it on GitHub
#674 (comment).

Sent from Postbox
https://www.postbox-inc.com/?utm_source=email&utm_medium=siglink&utm_campaign=reach

[joewellmade]

That's fixed it now so thanks for that, really appreciate it. Love the
theme. Not used 6 yet, looking forward to it.

Ole Fredrik Lie mailto:[email protected]
10 March 2016 14:50

As you can see, the script is now firing on load, resize and
orientationChange. I would suggest that you add |hashchange| to that
list. That should work. At least in theory :) Let me know how it goes.

|$(window).bind(' load resize orientationChange ', function () {
var footer = $("#footer-container");
var pos = footer.position();
var height = $(window).height();
height = height - pos.top;
height = height - footer.height() -1;

function stickyFooter() {
footer.css({
'margin-top': height + 'px'
});
}

if (height > 0) {
stickyFooter();
}
});
|

—
Reply to this email directly or view it on GitHub
#674 (comment).

Sent from Postbox
https://www.postbox-inc.com/?utm_source=email&utm_medium=siglink&utm_campaign=reach