Anchor does does not scroll to correct position
-
On this page, the anchor for the (contact) menu does not scroll to the correct position. It only scrolls a little bit, so I would need to click multiple times to achieve accurate scrolling.
The (contact) menu is the first row of a footer, present on each page. This first row has a text element linking to #contact as well as it is sticky and straight visible at initial visit. Because of this, the element with the #contact ID itself is in the row below which was the cause of an earlier issue of the same kind.
It was working correctly previously when I did not write this contact section as a footer. So I think it has sth to do with the footer architecture since, for example, the (works) menu has expected behaviour....
-
Hi luis!
Yeah, I think this is just some more complications with custom code.
Now that part of your website relies on a lot of custom coding, other parts of Lay Theme may not be compatible with it so well.Can you please send:
- a link to this forum topic
- your website address
- /wp-admin/ username and password
to: info@laytheme.com
I wanted to add some code to your custom code that we already have to probably fix this, but it seems like you changed your login info to your admin panel.
-
Okay, so basically for your contact anchor, I removed the anchor: #contact
And instead I just wrote some JavaScript that will scroll your page to the bottom when this button is clicked.
jQuery(document).on('click', '#contact-button', function(e){ e.preventDefault(); e.stopPropagation(); jQuery("html, body"). animate({ scrollTop: jQuery(document). height() }, "slow"); })
-
Okay, so basically for your contact anchor, I removed the anchor: #contact
And instead I just wrote some JavaScript that will scroll your page to the bottom when this button is clicked.
jQuery(document).on('click', '#contact-button', function(e){ e.preventDefault(); e.stopPropagation(); jQuery("html, body"). animate({ scrollTop: jQuery(document). height() }, "slow"); })
@arminunruh
Many thanks for that, Armin! =))It works nicely on Desktop, but on mobile it did not work on either Firefox, Chrome or Safari...
What could be the issue?
-
@arminunruh
Many thanks for that, Armin! =))It works nicely on Desktop, but on mobile it did not work on either Firefox, Chrome or Safari...
What could be the issue?
@user-4-33 Ah I see, it โย it's the anchor that's still there...
-
ah yea maybe u can change that
bascially you just remove #contact from the href=""
so the href is just empty, then give the contact button id="contact-button"
I also code custom websites or custom Lay features.
๐ฟ Email me here: ๐ฟ
info@laytheme.com
Our Web Development company: 100k.studio
Want to tip me? https://www.paypal.com/paypalme/arminunruh
Before you post:
- When using a WordPress Cache plugin, disable it or clear your cache.
- Update Lay Theme and all Lay Theme Addons
- Disable all Plugins
- Go to Lay Options โ Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"
This often solves issues you might run into
When you post:
- Post a link to where the problem is
- Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
- If the problem is difficult to explain, post screenshots / link to a video to explain it