Community Forums › Forums › Archived Forums › Design Tips and Tricks › Business Pro Smooth Scrolling
- This topic has 2 replies, 2 voices, and was last updated 5 years, 9 months ago by theDH.
-
AuthorPosts
-
July 15, 2018 at 8:27 pm #221703theDHMember
Seems like smoothing scrolling always gives me trouble, but this time I can't figure it out.
How do I change the scrolling parameters in the Business Pro theme? I extended the header to be page height, so now when I scroll, certain areas are off.
$('html, body').animate({ scrollTop: target.offset().top-500 }, 1000, function () {
Typically this would change it, but when I made the change to the minified CSS, no dice.
Thanks for the help in advance!
July 16, 2018 at 6:29 am #221707Victor FontModeratorBusiness Pro is not a Studio Press product. It is a community marketplace theme. Community marketplace developers support their themes directly. As the creators, they will be most familiar with the theme and be able to provide you with the best support. To receive the most timely response to your question, please contact Seo Themes support team.
However, in general terms, if Business Pro has a fixed header, it explains why smooth scrolling is off. Also, if you display the WordPress admin bar while you are developing, it adds another 32px to the mix that you have to account for.
Whenever I'm working on a theme for a client that has a fixed header, I use this code to account for the offsets. Maybe is will help you:
(function( $ ) { // Make sure JS is enabled. document.documentElement.className = 'js'; $(document).ready(function() { $( 'a[href*=#]:not([href=#])' ).click(function() { if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) { var target = $(this.hash), admin_offset, header_height, offset; target = target.length ? target : $( '[name=' + this.hash.slice(1) + ']' ); admin_offset = $("body").hasClass("admin-bar") ? 32 : 0; header_height = ($('header.site-header').css("position") === "fixed") ? $('header.site-header').outerHeight() : 0; offset = header_height + admin_offset; if (target.length) { $( 'html,body' ).animate({ scrollTop: target.offset().top - offset }, 1000); return false; } } }); }); })( jQuery );
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?July 16, 2018 at 5:58 pm #221719theDHMemberThanks Victor!
This working on some of my jQuery rust, but thus far I discovered that working with a headache last evening was a bad idea!
I switched over to the non-min JS and that helped (doh)! I then tried my own code as well as your spin on coming up with the offset value. Got that working just fine (thanks!) and now the scrolling appears broken. The offset (any offset) causes it to scroll slowly and then an ugly refocus on the proper element ensues. I guess it's a testament to how well the non-third party themes work from Studiopress.
I've put in a ticket, but if anyone else knows what's up, please let me know!
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.