Posted By

mishified on 07/27/17


Tagged

header sticky Unbounce


Versions (?)

Sticky Header


 / Published in: JavaScript
 

Place into before body end tag

  1. <script>
  2.  
  3. //Fixed Menu (Header or footer) v1.3.1
  4.  
  5. /**
  6.   * Do not remove this section; it allows our team to troubleshoot and track feature adoption.
  7.   * TS:0002-13-013
  8.   */
  9.  
  10. //Replace ID below with your own box ID
  11. var boxToAppend = '#lp-pom-box-177';
  12.  
  13. //Set to 'header' or 'footer'
  14. var headerOrFooter = 'header';
  15.  
  16. var backgroundCSS = {"position":"fixed", "left":"0", "top":"0px", "bottom":"auto", "width":"100%", "z-index":"899"};
  17. var colorOverlayCSS = {"position":"fixed", "left":"0", "top":"0px", "bottom":"auto", "width":"100%", "z-index":"auto", "border-style":"none none none none"};
  18. 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"};
  19.  
  20. if (headerOrFooter === 'footer') {
  21. backgroundCSS["top"] = 'auto';
  22. backgroundCSS["bottom"] = '0px';
  23. colorOverlayCSS["top"] = 'auto';
  24. colorOverlayCSS["bottom"] = '0px';
  25. childrenCSS["top"] = 'auto';
  26. childrenCSS["bottom"] = '0px';
  27. }
  28.  
  29. var boxParent = $(boxToAppend).parent();
  30. var boxClone = $(boxToAppend).clone()
  31.  
  32. boxClone.appendTo(boxParent).css(backgroundCSS).children().remove();
  33. $(boxToAppend).css(childrenCSS);
  34. $(boxToAppend + '-color-overlay').appendTo(boxClone).css(colorOverlayCSS);
  35.  
  36. </script>

Report this snippet  

You need to login to post a comment.