Anchor + Scroll

labradorfinancas · November 2015

Hello! I'm having a problem with the scrolling of the page. I am creating a single page with some anchor links. If I click on any of the header menu links, the page scrolls normally the way I want. But if I put a link anywhere within the page, either in the Revolution Slider or Visual Composer, it goes straight without showing scrolling. Why does it happen? Is there any way to get the scroll of the page body links act like the header menu links?

To view what is happening go to: http://teste.redelabrador.com.br/seja-um-empreendedor/

The menu link makes the page scroll normally. This link in revolution slider makes the page go to the point.

Thank you.

Albert · November 2015

Hi,

you forgot about scroll class and that's why you don't have smooth scroll.

artmetic · November 2015

Hi,

I have similar problem. I use Visual Composer on the page and I don't know how to add a scroll class to image element. Can you guys be more specific?

test webstie: http://vinex.stronazen.pl

I am refering to the red button "V" image that has next section as a link. The smooth scroll doesn't work.

Best regards,
Bartek

Albert · November 2015

@artmetic There is nothing else what we can add. Like we wrote above, you must set scroll class for a link if you want this line to work with nice scroll. So for example, simple link will look like below:

<a href="#" class="scroll">Simple Link</a>

labradorfinancas · November 2015

Thanks a lot!!!

Albert · November 2015

You're welcome

artmetic · November 2015

Hi Guys, it helped also on my page. Right now scrolling works, but when I click the link, there is a FLASH when for a milisecond, browser goes down to the anchor point and then comes back to where it was and finally do scroll.

The same happens on the labradorfinancas site, but because of colors used, it is not so visible like on http://vinex.stronazen.pl. Is there a way to do the scrolling like after clicking on menu button or it is just the way it needs to be?

Best regards,

Bartek

Albert · November 2015

@artmetic This is just the way it needs to be. There is nothing what you can do in this case.

binyaminmellish · November 2015

Hello. This millisecond flash appears on my site too.

http://ponderosa.cloudapp.net/solutions/

I'm not trying to fix it, just thought you might like to know.

Albert · November 2015

@binyaminmellish Where you got this flash? Because 5 different persons checked your site and nobody did noticed any flash at all.

binyaminmellish · November 2015

It happens when you click the Learn More button demonstrated in the video.

Glitch tested on Mac El Capitan, Chrome & Safari.

Albert · November 2015

@binyaminmellish We do not noticed anything like that on our side and to be honest we have no idea what this could be. You should turn off all extra plugins and remove custom css's but if this won't help, then we do not have other suggestions.

artmetic · November 2015

@binyaminmellish labradorfinancas muffingroup the problem is with the script file. I used these instrucions: http://www.dwuser.com/education/content/quick-guide-adding-smooth-scrolling-to-your-webpages/ and it works like a charm. No flash appears and the script is making looking through the site much better experience.

See 2 first down arrows after slider = smoothscroll class (external script)

Next 2 down arrows with betheme's "scroll" script

http://vinex.stronazen.pl

Hope I helped you guys...

Albert · November 2015

Thanks for your solution @artmetic. We'll have a look on it closer while future updates for sure.

antou82 · November 2015

hi,

can you tell me if i am using a single image element on vc what i should put on the "link" space??

instead of #myanchor i tried <href="#myanchor" class="scroll" but didnt work

any idea plz??

Albert · November 2015

@antou82 Your html code is broken. Supposed to be:

<a href="#myanchor" class="scroll">text link</a>

highflydesign · February 2017

Problem solved thank you!

Albert · February 2017

@highflydesign To activate smooth scroll for menu items, you need to set ONE PAGE option for page under Page Options section.

FBarros82 · May 2017

I'm having this problem on one of my subpages; I'm trying to have a button scroll down to a form that is located at the bottom of the page.

This is my button code:

[button title="Contact Us" icon="icon-right-open" icon_position="left" link="#form" color="#fff" font_color="#434344" large="1" class="scroll"]

The section id is called #form

and I've tried setting the page to "one page" and still not working; any ideas?

Bryan · May 2017

Hi,
Please send a link to your page.
thanks

FBarros82 · May 2017

You'll notice a contact us button 1/2 way down the page, if you click it it will take you to the bottom where the form is.

Bryan · May 2017

Hello,
Please edit your page and under the muffin builder enable the one-page options. Look: http://prntscr.com/f5rb3i

FBarros82 · May 2017

Hi,

I enabled one-page but I'm still getting the same results. I'm not understanding why b/c when I click on the "back-to-top" button it slides perfectly.

I have smooth scroll enabled instead of nice-scroll but I've tried both.

Any other ideas?

EDIT*:

Nevermind, I'm not quit sure how but I fixed it by deleting the button and re-adding it from scratch; it now slides perfectly.

Thanks for your attention

fresewolff · September 2018

Hi,

how can i achieve smooth scrolling within a TrailerBox?

The class scroll is linked to the div, not to the href!

Pablo · September 2018

If you do not want to use a normal menu to link the user to sections,
you need to add a 'scroll' class to the custom link element .

Paste a trailerbox shortcode inside the div in column and give it id with name of it (#myscrollid)

and then, make button with href to this element and class scroll.

Thanks.

Anchor + Scroll

Comments