Scroll Bottom Anchor

[emeffinsteve]

The scroll bottom anchor is enabled, but it doesn’t function. Also, is it possible to change the “icon” that’s used for it?

http://taylorvoip.com

[nabeel]

Hi there,

Thanks for writing around! Please check for the following first:

1. Ensure everything is up to date according to our version compatibility list at https://theme.co/apex/forum/t/troubleshooting-version-compatibility/195. Please follow the best practices when updating your theme and plugins. See https://theme.co/apex/forum/t/setup-updating-your-themes-and-plugins/62 for more details.

2. Clear all caches including browser cache then deactivate your caching plugins and other optimization plugins.

3. If you’re using a CDN, please clear the CDN’s cache and disable optimization services.

4. Test for a plugin conflict. You can do this by deactivating all third party plugins, and seeing if the problem remains. If it’s fixed, you’ll know a plugin caused the problem, and you can narrow down which one by reactivating them one at a time.

5. Remove custom CSS, Javascript and templates.

Thanks.

[emeffinsteve]

1: Done.
2: Done.
3: N/A.
4: Tested.
5: N/A.

Any other suggestions?

[jade]

Hi there,

This code that is in the custom JS seems to be causing the issue:

$(a.bottom).wrap('<a href="#top-section" />');

Please update it to:

jQuery('a.bottom').wrap('<a href="#top-section" />');

In case the issue persists, please add this code in the custom Javascript in the Slider Settings:

jQuery(function($) {
    $('.x-slider-container.below .x-slider-scroll-bottom').off('touchstart click');
    $('.x-slider-container.below .x-slider-scroll-bottom').on('touchstart click', function(e) {

    e.preventDefault();

    var mastheadHeight       = $('.masthead').outerHeight();
    var navbarFixedTopHeight = $('.x-navbar-fixed-top-active .x-navbar').outerHeight();
    var sliderAboveHeight    = $('.x-slider-container.above').outerHeight();                       
    var sliderBelowHeight    = $('.x-slider-container.below').outerHeight(); 
    var heightSum            = sliderAboveHeight + sliderBelowHeight - navbarFixedTopHeight;

    $('html, body').animate({
      scrollTop: heightSum
    }, 850, 'easeInOutExpo');

  });
});

[emeffinsteve]

Excellent! Now how can I change the arrow to be something else? Would love if it could be a mouse instead.

[emeffinsteve]

And how do I change the color of it when the mouse hovers over it?

[Joao]

Hello,

Please add the following code to Theme Options CSS

.x-slider-scroll-bottom.above:hover {
    color: red;
}

Hope it helps