8 0 h g

Problem : Divi doesn’t always scroll to the right place. In the example above, Divi will scroll a bit past the top of the target section.

Solution trouvée ici :

https://divibooster.com/fix-divi-anchor-links-not-working-correctly/

The Divi Theme has a nice feature whereby you can use CSS IDs as anchor links. If you give one of your Divi Builder components (a section, module, etc) a CSS ID of, say, “jumptohere”, then you can create a link of the form https://www.mysite.com/mypage/#jumptohere and when clicked it will take your user straight to the part of the page with that component.

Mark gave me a great example of when this might be useful. If you have a fullscreen header on your homepage, you can make internal links to your homepage jump straight to the section below the fullscreen header, so that users aren’t forced to scroll past the fullscreen header each time they return to your homepage.

Mark also pointed out a problem with this – Divi doesn’t always scroll to the right place. In the example above, Divi will scroll a bit past the top of the target section.

We can fix this using this following modified version of code provided by Elegant Themes:

<script>
document.addEventListener('DOMContentLoaded', function(event){ 

    if (window.location.hash) {
        // Start at top of page
        window.scrollTo(0, 0);
		
        // Prevent default scroll to anchor by hiding the target element
        var db_hash_elem = document.getElementById(window.location.hash.substring(1));
        window.db_location_hash_style = db_hash_elem.style.display;
        db_hash_elem.style.display = 'none';
		
        // After a short delay, display the element and scroll to it
        jQuery(function($){
            setTimeout(function(){
                $(window.location.hash).css('display', window.db_location_hash_style);
                et_pb_smooth_scroll($(window.location.hash), false, 800);
            }, 700);
        });		
    }
});
</script>

The main modification I’ve made is to bypass the original code’s requirement to be added into core theme files (which would be overwritten by Divi upgrades). This JavaScript code can be added into Divi using the integration option at: > Theme Options > Integration >”Add code to the < head > of your blog”, and as a result will survive theme updates.

This is also available as an option in Divi Booster 2.1.8 onwards. You’ll find the option under “Site-wide Settings > Links > Fix Divi anchor link scrolling”.

Et ça marche

Source :