Hi
I have created a button on my product page -> https://teknifi.co.za/product/sonos-era-300/ – scroll down slightly to “View Complimentary Service” in the Description part of page, but when you click on the “View Complimentary Service” it jumps to middle of page and not to the the Complimentary Service Container. Once you click on the button, it jumps to the incorrect part of the same page. I want it to scroll smoothly to the correct part of the page…
This is how I am doing this:
1. in the HTML Block where I have created the block about the product, description, specs etc, I created the Button and in the button widget under Content -> in the Link field, I put “#link” see screenshot 1.
2. I scroll further down to Complimentary Sonos Era…. I clicked on the header container and in the CSS ID I put “free” (without the #) as seen in screenshot 2
Once publish the page I go to the frontend of Google Chrome it works on my side but on Google chrome on my mobile or on Firefox and Microsoft Edge, it jumps halfway to the page.
How to I make to scroll to where I want it to be scrolled to in a smooth scrolling action instead of jumping to the right container.
Attachments:
You must be
logged in to view attached files.
.
