Scroll w/ anchors

[Diagonal]

Hi there!

I'm trying to add a scroll effect using anchor points. It actually works, the only thing is I'd like the block not to display on top, but in a lower position (80px, just the menu height).

Here's the code I'm using, I guess it should be kind of easy but I have no coding skills at all :/

Can anybody help? Thanks in advance!

<script>

jQuery(document).on( 'click', 'a[href^="#"]', function(e){
    e.preventDefault();
    var hash = jQuery(this).attr('href');
    var el = jQuery(hash);
    var top = el.offset().top;
    jQuery('html, body').animate({
        scrollTop: top
    }, 300, 'swing',
        function() {
            window.location.hash = hash;
        }
    );
} );

window.laytheme.on('newpageshown', function(){
    var hash = window.location.hash; 
    var el = jQuery(hash);
    if(el.length > 0) {
        var top = el.offset.top;
        window.scroll(0, top);        
    }
});

[Diagonal]

Here's the site I'm working on in case it helps :)

http://www.metal-horns.co/resist

[mariusjopen]

Dear @Diagonal
what should happen when you click where?

Best!

Marius

[Diagonal]

Hi Marius!

Sorry for the awkward explanation, and thank you for this awesome theme! I'm using this Laytheme option:

Cover options > Scroll down on Cover click ✅

Works smooth, but the text is hidden by the bar menu. I tried to solve it with anchors and some code, but I have no coding skills at all...

[Diagonal]

UPDATE: I managed to make it work with anchor navigation and custom code! The bad news: after the scroll effect, the browser URL adds a #hash at the end (the anchor). To prevent poor user experience, I'd need to remove it from the browser URL bar, as an extra click is required in the back button to actually go back a page.

I've realized no #hash is added when using the "scroll down on cover" option, so I guess that would do the job ... but I still have no idea how can I change the ".top" value to a different position. I don't want to add no margin or padding to keep the layout as it is in case the user doesn't click over the cover image.

Note: I wouldn't mind AT ALL if the "back to top" jumps to the text block instead of the hero image, just in case :)

[Diagonal]

Hi there! I've been trying so hard, but I'm not able to solve it :/
I gave up the anchor navigation, as I've read it's not possible... so I guess the only solution would be using the "Scroll down on Cover click" and change somehow the top position. Please help!

http://www.metal-horns.co/resist-2