Navigation
This is archived content. Visit our new forum.
  • Author
    Posts
  • #670086

    knmcmahon
    Participant

    Hello –

    I am using the Integrity 7 setup and I was wondering if there was a way to set up a button or something that would take a visitor back up the top of the page at any given place. Rather than just being at the bottom of the page, I’d prefer it to move as you scroll through, but worst case would be a stationary button at the bottom

    Thanks,
    Kevin

    #670188

    Rupok
    Member

    Hi Kevin,

    For the default Scroll Top button, kindly enable Scroll Top Anchor under Customize > Footer > Scroll Top Anchor in the Customizer.

    If you want to setup your custom button then follow the reply below.

    Cheers!

    #670192

    Zeshan
    Member

    Hi Kevin,

    Thanks for writing in!

    You can use this HTML code anywhere in your page:

    <a class="x-scroll-top right fade in x-scroll-top-custom" href="#top" title="Back to Top"><i class="x-icon-angle-up" data-x-icon=""></i></a>

    Then insert following CSS code under Custom > CSS in the Customizer:

    .x-scroll-top.right.x-scroll-top-custom {
        position: static;
        float: none;
        display: inline-block;
    }
    

    After that add this code under Custom > JavaScript in the Customizer:

    jQuery(document).ready(function($) {
    
      var windowObj            = $(window);
      var body                 = $('body');
      var bodyOffsetBottom     = windowObj.scrollBottom();             // 1
      var bodyHeightAdjustment = body.height() - bodyOffsetBottom;     // 2
      var bodyHeightAdjusted   = body.height() - bodyHeightAdjustment; // 3
      var scrollTopAnchor      = $('.x-scroll-top-custom');
    
      function sizingUpdate(){
        var bodyOffsetTop = windowObj.scrollTop();
        if ( bodyOffsetTop > ( bodyHeightAdjusted * 0.75 ) ) {
          scrollTopAnchor.addClass('in');
        } else {
          scrollTopAnchor.removeClass('in');
        }
      }
    
      windowObj.bind('scroll', sizingUpdate).resize(sizingUpdate);
      sizingUpdate();
    
      scrollTopAnchor.click(function(){
        $('html,body').animate({ scrollTop: 0 }, 850, 'easeInOutExpo');
        return false;
      });
    
    });
    

    Thank you!

    #670468

    knmcmahon
    Participant

    Hi – thanks for the quick reply! I wound up turning on the anchor and setting the % to zero so that it’s always in the lower right.

    You guys are great.

    Thanks,
    Kevin

    #670604

    Nico
    Moderator

    You are great as well.

    Feel free to ask us again.

    Have a great day! 🙂