I am creating an L.P that consists of several blocks/sections in which at the end of each block or section I am adding a CTA with an icon indicating that they continue down. So that when clicking on the CTA this send you to the next section or block, I have created an anchor that links the CTA with the section or block title. But it is not responding to that anchor. In the CTA where the option "Link URL" is added, add the link of the page + the anchor ID (https://www.inbest.cloud/desarrollo-en-la-nube/#nube) .
I have generated the anchor in title that I want you to leave by clicking on the CTA. (<h2><a id="nube"></a>¿QUÉ ES LA NUBE?</h2>). But it does not generate any action. To what is it possible that I should not take any action? Does the anchor do wrong or does the CTA have the name of the anchor wrong?
jul 10, 20187:55 AM - editado jul 11, 201810:38 AM
Experto reconocido | Partner nivel Elite
CTA does not take anchor for rich text
Hello @Janette - I don't see any elements in your code that have an ID of #nube. However, when I add the id to the <h2 like so, <h2 id="nube">, I am able to drop the following javascript into your page and see the scrollto functionality you are looking for.
$(document).on("click", '.hs_cos_wrapper_type_cta a', function(e) {
var thisE = $(this);
var linkto = thisE.attr('cta_dest_link');
if (linkto.indexOf('#') > -1) {
var hashid = linkto.split("#").pop();
$('html, body').animate({ scrollTop: $('#'+hashid).offset().top}, 1000);
e.preventDefault();
}
});
What that script does, is look through all the CTA's to find a hash and uses jquery to animate to that element id based on the hash.
CTA's are loaded dynamically so, me adding that script to the console works because CTA elements have already loaded. I tried to add code into that script to help make it work on dynamically loaded elements but, if the script doesn't work it's either related to that issue or the id that matches the hash is not found in the DOM.
If this answer helped, please, mark as solved 😄
tim@belch.io | forms.belch.io | Design your own Beautiful HubSpot Forms; No coding necessary.