Make Button Scroll Down Page?

Hi

I am using the Adversary theme for my website and have an indexed home page. I have tried id tagging a block as suggested elsewhere and linking to that id with my button block without success.

When you see my homepage, it is the featured photo with page title and description (which has a button in it). As you scroll down the photo has a parallax effect. I want my 'Learn More' button to simply scroll down to the first page contents, just past the photo.

How can I do this?

Any help is much appreciated, thanks.

Here is the page and button (front and centre) I am referring to: http://www.triggerair.com

If you provide a link to your site or the page in question, the community can more easily assist.

Sure, here it is front and centre: http://www.triggerair.com

This can be done using an Anchor Link. For reference on creating this kind of link, check out this guide here. Essentially you had the right idea of creating a code block and giving it an id. Once you have done this you need to link to that id using just the id selector and not an entire URL. For instance, if I have a page at the bottom of my index and on this page is the code block id="cupcakes", then the link I will use in the button in my page banner will just be #cupcakes instead of www.domain.com/page-title#cupcakes. The browser will recognize that this id is on the current page and will scroll down to it.

As I understand your question, you want the "Learn More" button under the "Trigger Air Aerial Film and Photography" heading to scroll down to the "Why Use A Drone" heading.

Insert a code block at the top insertion point of the "Why Use A Drone" heading. In the code block enter the following:

<div id="Why-Use-A-Drone"></div>

Then for the href attribute of the Learn More button enter href="#Why-Use-A-Drone". Use this instead of the href="##" that you currently have.

This will cause the Learn More button to scroll down to the "Why Use A Drone" section.

This is, with a bit more specifics, what @justin1024 was telling you in his answer.

Hope this helps.

Hi, thanks. But I actually want to scroll to the very first paragraph above the showreel, directly below the feature image. However when I put an id to scroll to it tries to scroll but just bounces back up.

Hi, thanks. But I actually want to scroll to the very first paragraph above the showreel, directly below the feature image. However when I put an id to scroll to it tries to scroll but just bounces back up.

It looks like you've put the

<h3 id="top">About Us</h3>

in a code block. As an experiment, try putting this in the code block:`

`Change the Learn More button's href to href="About-Us" (just in case "top" is used as an id elsewhere; probably not but you know "About-Us" won't be).

It's a guess. It may not work but it's the thing I would try.

After leaving the above comment I did what I should have done before -- try your way out on my site, Bedford. I did that -- just putting the h3 directly inside the code block with the id on it -- and it worked perfectly. So, I expect trying it my suggested way will not improve things.

I wonder if the parallax feature has something to do with it. Bedford is not a parallax template.