The scroll bottom anchor is enabled, but it doesn’t function. Also, is it possible to change the “icon” that’s used for it?
Hi there,
Thanks for writing around! Please check for the following first:
-
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.
-
Clear all caches including browser cache then deactivate your caching plugins and other optimization plugins.
-
If you’re using a CDN, please clear the CDN’s cache and disable optimization services.
-
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.
-
Remove custom CSS, Javascript and templates.
Thanks.
1: Done.
2: Done.
3: N/A.
4: Tested.
5: N/A.
Any other suggestions?
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');
});
});
Excellent! Now how can I change the arrow to be something else? Would love if it could be a mouse instead.
And how do I change the color of it when the mouse hovers over it?
Hello,
Please add the following code to Theme Options CSS
.x-slider-scroll-bottom.above:hover {
color: red;
}
Hope it helps
This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.