Menu icon Foundation

Designer

My Posts


My Comments

Tracy Shorrock commented on Tracy Shorrock's post about 4 years

Hi,

I have achieved a footer that sticks to the bottom of the window. However, there is a small vertical scroll which shouldn't be there because the main content is way up the page. The footer itself seems to be 160px, but I don't know where it's getting this height from; I've checked the wp-forge css file and my child theme css and there's no reference to 160px.

There also seems to be a jump when you initially load the page; the footer starts in it's usual position, stuck to the bottom of the .content_container and then quickly jumps to the bottom of the screen but with the vertical scroll.

I discovered the problem w/ the code snippet from Charles Smith's solution was something to do with Wordpress using jQuery in noConflict mode by default (ref: http://stackoverflow.com/questions/7975093/typeerror-undefined-is-not-a-function-evaluating-document).

Below is what now appears in footer.php.
```
(function($) {
$(window).bind("load", function() {
var footer = $(".footer_container");
var pos = footer.position();
var height = $(window).height();
height = height - pos.top;
height = height - footer.height();
if (height > 0) {
footer.css({
'margin-top': height + 'px'
});
}
});
})(jQuery);

Can anyone suggest a better solution. If not, maybe someone could point to where the 160px footer is coming from and how to fix the jump.

Cheers,

Tracy

Posts Followed


Following

    No Content

Followers

My Posts

My Comments

You commented on Tracy Shorrock's post about 4 years

Hi,

I have achieved a footer that sticks to the bottom of the window. However, there is a small vertical scroll which shouldn't be there because the main content is way up the page. The footer itself seems to be 160px, but I don't know where it's getting this height from; I've checked the wp-forge css file and my child theme css and there's no reference to 160px.

There also seems to be a jump when you initially load the page; the footer starts in it's usual position, stuck to the bottom of the .content_container and then quickly jumps to the bottom of the screen but with the vertical scroll.

I discovered the problem w/ the code snippet from Charles Smith's solution was something to do with Wordpress using jQuery in noConflict mode by default (ref: http://stackoverflow.com/questions/7975093/typeerror-undefined-is-not-a-function-evaluating-document).

Below is what now appears in footer.php.
```
(function($) {
$(window).bind("load", function() {
var footer = $(".footer_container");
var pos = footer.position();
var height = $(window).height();
height = height - pos.top;
height = height - footer.height();
if (height > 0) {
footer.css({
'margin-top': height + 'px'
});
}
});
})(jQuery);

Can anyone suggest a better solution. If not, maybe someone could point to where the 160px footer is coming from and how to fix the jump.

Cheers,

Tracy

Posts Followed

Following

  • No Content

Followers

  • No Content