Sure, here’s the JavaScript to use for the vertical bar:
jQuery(window).scroll(function () {
var y = jQuery(this).scrollTop();
if (y > 500) {
jQuery('.a2a_floating_style.a2a_vertical_style').show();
} else {
jQuery('.a2a_floating_style.a2a_vertical_style').fadeOut();
}
});
Please post a URL that has your implementation if you have any trouble.
Thanks Micropat, Works perfectly
Hello,
The plug-in is great, especially because it’s AMP-enabled. I also enabled a show-on-scroll feature on my website but I added a “debounce” function to prevent jerky response or consuming too many resources.
var debounce_timer = 0; // Used by debounce function
var min_height = 250; // Minimum height for showing the buttons
var ms_debounce = 250; // Debounce time (in ms)
$(window).scroll(function()
{
if (debounce_timer)
{
window.clearTimeout(debounce_timer);
}
debounce_timer = window.setTimeout(function()
{
var y = jQuery(this).scrollTop();
if (y > min_height)
{
jQuery(‘.a2a_floating_style.a2a_vertical_style’).show();
}
else
{
jQuery(‘.a2a_floating_style.a2a_vertical_style’).fadeOut();
}
}, ms_debounce);
});
Hi,
The scroll fade JS worked well, but it is overriding the CSS that removes it from the homepage:
body.home .a2a_floating_style,
body.page .a2a_floating_style,
body.category .a2a_floating_style { display: none; }
Any idea on how I can have the fade only show on posts?
Thanks!
@mattymat Use the !important declaration like so:
body.home .a2a_floating_style,
body.page .a2a_floating_style,
body.category .a2a_floating_style { display: none !important; }
Thanks! Worked like a charm!
