How do I adjust the one page scroll so that the top section isnt hidden by nav?

4 replies · opened Nov 4, 2016

Ssicnarf033Nov 4, 2016

Hello,

I am currently using the one page scroll to anchor feature but notice that when I select through the navigation, it accounts for the navigation. I am able to see my section heading text but if I type "www.website.com/index#section-1" directly into the URL, The section heading text will be hidden under the navigation. Can someone help please?

Ssicnarf033Nov 4, 2016

Error uploading images...

added below.

The desired function is to be able to enter "website.com/index.html#section-1" and then have the section heading text appear under the navigation.

SSemicolon WebSTAFFNov 6, 2016

Hello,

Currently, the Scroll to Section functionality is not available from External URLs. However, you can simply add the following JS code at the bottom of the Page just after the js/functions.js JS File Linking to enable this:


    jQuery(document).ready( function(){
        setTimeout(function() {
            if (location.hash) {
                window.scrollTo(0, 0);
            }
        }, 1);
    });

    jQuery(window).on('load', function(){
        var divScrollToAnchor = window.location.hash;

        if( typeof divScrollToAnchor !== 'undefined' ) {
            var t = setTimeout( function(){
                $('html,body').stop(true).animate({
                    'scrollTop': $( divScrollToAnchor ).offset().top - 100
                }, 700, 'easeOutQuad');
            }, 1000);
        }
    });

This should definitely work fine. Let us know if we can help you with anything else or if you find any issues.

Ssicnarf033Nov 8, 2016

I put the script just below the function as mentioned and now I am getting a console error when I am at the homepage.

Uncaught TypeError: Cannot read property 'top' of undefined(…)

SSemicolon WebSTAFFNov 9, 2016

Hello,

Can you please provide us with a Live URL so that we can check out the exact issue and provide you with a more accurate solution for this. Thanks for your Patience.

Meanwhile, do let us know if we can help you with anything else or if you find any further issues with Canvas.

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard