▼
Streaming live at 10am (PST)

How to make a logo (or any element) anchor to top of screen?

Design help General
#1

READ ONLY LINK DOES NOT DISPLAY WEB FONTS—SEE INTENDED DESIGN HERE: http://bohldiesel.com/

Read only link: https://preview.webflow.com/preview/bohldiesel?preview=c04db0748fcfdc002836389a8fc45c42

I have three sections on a one page site that are also anchor points via the navigation. I need the logo to be an anchor for “top of page”—when clicked the logo should bring the user back to the very top of the page.

I currently have the logo div link set as an anchor to the header…however, when the logo is clicked, the screen simply moves up in small increments with each click. This should be a one-click action back to top.

How?

#2

Hey Cynical,

it wont work because your header (top-anchor) is sticky.
Therefore its always…on top of the screen.

When you then click on an anchor navigation hyperlink, that relates to the top anchor link, its already there. So it wont scrollt back to top at all.

You need to set another div-element above the header (maybe hidden, or with no size at all) so that there is an existing top element that is not set sticky.

Hope that helps.

Daniel

#3

Ahhh-ha. Excellent. I will try this. TY!

Any idea why my post was flagged?

#4

Hi @CynicalKiddo, sorry about the Forum trouble, I finally tracked this down, it was because you are a new user, and had created a topic with multiple links, and our system flagged that… All should be ok now. Thanks and sorry for the trouble.

Cheers, Dave

#5

Whew! Again, thanks very much Dave!

#6

@Daniel_Schultheiss Fixed! One step closer!

2 Likes
#7