Problem with anchors

[mobentis]

Google Chrome

[Raghavendra]

This is probably due to SiteOrigin widget JavaScript providing the padding for the page sections and hence changing their height during runtime with the browser to sticking to the position without considering the padding added later by JS.

Can you try adding padding to the page sections manually in Custom CSS in theme options and see if that helps resolve the issue? Pls let me know if you need further details on how to go about this. Thanks for bringing this to our attention.

[mobentis]

Hi, thanks for your help.

I tried this and don’t work.

[Raghavendra]

I checked the dev installation and the issue is real and is due to sliders – team slider and testimonials slider. When you move these sections to the bottom of the page, everything looks ok. I can think of one reason why this is happening – the sliders alter the height through JS. Without the slider script, the slider would render the slider elements one below the other and hence the height of the section would be much larger than what you actually see in the page with a slider. The browser considers the actual height of the section while deciding to display the section.

Another reason why this could be happening – the slides of the slider are all set to display: none in CSS (effectively goes out of document flow and hence height is zero for the section) and only altered after we trigger the flexslider JS which sets one of the slides display: block later. Hence the issue. We need to think of a solution to this – may be set a min-height to these two sections like this –

.team-slider { min-height: 660px; }
.testimonials2-slider-container { min-height: 353px; }

.flexslider .slides > li { display: block; }

Can you give a try and see if that works? My tests have not been very encouraging so far but hopefully we have a simple solution to this issue. Let me think over more about this and get back to you. Thanks for your patience.

[mobentis]

I appreciate your help, I add this css properties to Custom CSS and now the contact-us-section link works, but the clients links get me to the contact-us-section too. And the client logos disappear.

[Raghavendra]

I checked your site and do not see any issues with client logos disappearing – do you mean the logos gets pushed to the top or masked/hidden?

[mobentis]

They dissapear if you use the link from an external web.

[mobentis]

The problem of client images is solved. The anchors now work better, but still have problem with the final position when the link is an external page.

[mobentis]

I’m still having big problems with anchors, any solution?

[Raghavendra]

Let me check on the same again and get back to you. We know this issue is due to flexslider and how it has been designed – we need to find out if there is a way to fix it. Thanks

[Author]

Posts