-
Posts
-
I ran into an odd problem and wondering if anyone can assist. I’m using some anchor links on a longer page and I’m also using a fixed header. When you click on the anchor link, it jumps to that anchor on the page, but the problem is that it jumps to that link ignoring the fact that the fixed header is in place, therefore the fixed header covers the first few links of the content. Also, it works ideally in mobile phone view as there is NOT a fixed header when viewing it on a mobile screen. Therefore, putting the anchor link up higher on the page to offset the problem really wouldn’t work as it would mess things up for the mobile phone view.
Does anyone have any feedback on how to make this work?
Thanks!
Jeff
Hey Jeff,
Can we see the site live? I’ve not had a lot of experience setting up a one page site with Enfold yet so seeing how you have it set up and then replicating the layout and bug testing from there will be the best route for us to help :)
Regards,
Devin
Hi Devin,
Sure thing. Here is the link to the page I was talking about: http://millcreekmetro.wpengine.com/visit/places/mill-creek-park/fellows-riverside-gardens/weddings-rentals/
(hosted on WPengine) />I’m not using a one page site, rather this is a page where we will have some anchor tags. For an example, in the first table, click the word “Gazebo” or “Kidston Pavilion” in the first column and it should jump you to the appropriate place within the page and then you should see the issue I am talking about.
Thank you,
Jeff
Hi,
Put
<a name="gazebo"></a>a bit above , in front of
<a href="#pavilion">Kidston Pavilion</a>This way the top part will be accounted for. And in mobile browsers the small difference will still make it visible. And do similar for the other anchors, just place them a bit earlier , Since i dont think there is another way to ofset the destination of an anchor.
Thanks,
nick
- The topic ‘Anchor Links with Fixed Header’ is closed to new replies.