Anchor link within sticky bar


I am using below script for the sticky bar - I have it for the #lp-pom-box-907 (which is the sticky header) - the header is transparent and within the #lp-pom-box-907, I have a button which is visible and should be an anchor to a box that is almost at the bottom of the page. Using the JS and setup from this article: I was not able to get it working, so does that have to do something with the JS for the sticky bar?

Here is JS I am using for the sticky bar:

//Fixed Menu (Header or footer) v1.3.1

* Do not remove this section; it allows our team to troubleshoot and track feature adoption.
* TS:0002-13-013

//Replace ID below with your own box ID
var boxToAppend = ‘#lp-pom-box-907’;

//Set to ‘header’ or ‘footer’
var headerOrFooter = ‘header’;

var backgroundCSS = {“position”:“fixed”, “left”:“0”, “top”:“0px”, “bottom”:“auto”, “width”:“100%”, “z-index”:“899”};
var colorOverlayCSS = {“position”:“fixed”, “left”:“0”, “top”:“0px”, “bottom”:“auto”, “width”:“100%”, “z-index”:“auto”, “border-style”:“none none none none”};
var childrenCSS = {“position”:“fixed”, “left”:“auto”, “top”:“0px”, “bottom”:“auto”, “width”:“100%”, “z-index”:“999”, “border-style”:“none none none none”, “border-width”:“0px”, “background”:“none”};

if (headerOrFooter === ‘footer’) {
backgroundCSS[“top”] = ‘auto’;
backgroundCSS[“bottom”] = ‘0px’;
colorOverlayCSS[“top”] = ‘auto’;
colorOverlayCSS[“bottom”] = ‘0px’;
childrenCSS[“top”] = ‘auto’;
childrenCSS[“bottom”] = ‘0px’;

var boxParent = (boxToAppend).parent(); var boxClone = (boxToAppend).clone()

(boxToAppend).css(childrenCSS); (boxToAppend + ‘-color-overlay’).appendTo(boxClone).css(colorOverlayCSS);

Thank you!

Hey @Jan_Urbanek :slight_smile:

Could you share the URL to the page this is on? That would be helpful to see what might be happening on the page.

Hey Kyle,

I was able to solve this problem on my own. Thank you that you were willing to help! :slight_smile:


1 Like