Page Anchors

[Richard2123]

Hi, I am working on a single page website which uses page anchors. Under the nav I have a full width video that scales up and down with the browser, the problem I have is that as the video height gets larger the page does not scroll down to the correct place, can I make the anchor points move with the page as it everything else gets pushed down?

Thanks

[ankushr40215001]

Hey Richard,

Probably Ii didn't get your query quite well.

Can you please explain me with an example, or share a site link to test and figure what exactly needs to be fixed?

Thanks,

Ankush

[Nancy OShea]

Hit F5 to refresh your browser after resizing viewport.   I'ts unlikely that average people will change their screen size.  That's something designers do when testing the layout.

[Ussnorway]

it sounds like your nav is in fact an accordion widget of some kind?

if so then Nancy is correct and F5 will be the best work around for users to fix your design... another option for you to fix it would be to use the default menu widget that comes in Muse and place it on a layer above the video one

[fotoroeder]

Hi Richard,

sounds like face, that anchors normally doesn`t behave as intended in fluid width breakpoints.

Do you use fluid width breakpoints? The only way in that case would be to place anchors inside textboxes, as these ones behave "right" in fluid width designs. Like this, your menu items make the browser stop at the right places throughout breakpoints.

Let us know if this points to the help you need.

Best Regards,

Uwe

[Günter Heißenbüttel · Accepted solution]

Page anchors have a fixed position on the page. When a responsive page is scaled, the content „moves“, but the anchor stays fixed – what causes a jump to an „incorrect" position, when an anchor link is clicked.

Solution:

Place an empty text field into the page stream (so that it moves together with the other elements), and copy the anchor into this textfield (Yes, this is possible!). Now the anchor moves together with the textfield and its correct position is preserved.