[PhilToneParticipant]

This reply has been marked as private.

[RadModerator]

Hi Phil,

You don’t have to add your own ID. Accordion auto-generate their own ID. For example,

http://phil.razvanlazar.de/solutions/#collapse-9

You don’t have to touch or change their ID, not possible. All you could do is use it.

The other issue is that new accordion has different structure, and you need to change your code to this.

/* Open Accordion from Link */
jQuery(function($){

	$(document).ready(function(){ jump_to_tab( $, $('.x-nav-tabs .x-nav-tabs-item a[href="#' + location.href.split("#").slice(-1)[0] + '"], a[href="#' + location.href.split("#").slice(-1)[0] + '"].x-accordion-toggle') ); });
	$('.enable_jump_to').click( function(e){ e.preventDefault(); jump_to_tab($, $('.x-nav-tabs .x-nav-tabs-item a[href="' + $(this).attr('data-jump-target') + '"], a[href="' + $(this).attr('data-jump-target') + '"].x-accordion-toggle') ); } );

});

function jump_to_tab($, tab_nav) {
			if(tab_nav.length >=1) {
	            $(tab_nav).click();
	            $('html,body').animate({scrollTop: $(tab_nav).offset().top - ( $('.x-navbar').height() + 50 )},700 ,'swing');
        	}
}  

Hope this helps.

[threadpieceParticipant]

Hurray! I read the whole thread and then the latest version of the code got it working 😀 Thanks for this!

[FriechModerator]

Glad to hear that, feel free to get in touch with us regarding any further queries about the X|Theme and Cornerstone.
Cheers!

[tomfavellParticipant]

Sorry guys still do need assistance.

Unfortunately the link you sent to Th_D about anchor links has expired as that would have probably helped me.

I know I am being proper nooby about this but in your example

<a href="http://domain.com/my-page/#tab-1">Jump and Open Tab/Accordion #1</a>

What is the unique ID you’ve given your tab?

Is it “tab 1”? I know you can’t use hyphens in the ID or it breaks the tabs but I can’t seem to make this work.

[tomfavellParticipant]

Apologies guys – it has worked!

Hadn’t updated the custom JavaScript! 😵

[RupokMember]

Glad that you figured it out. Feel free to let us know if you face any other issue. We’ll be happy to assist you.

Thanks for using X.

Cheers!

[hgstudioParticipant]

Hi,

I used the code here: https://community.theme.co/forums/topic/open-accordion-from-link/page/5/#803817 and it seems to work, but after the height is offset, it jumps back up to the top of the anchor, setting the tabs heading back underneath the nav.

Any idea why this is happening?

http://gravynet.staging.wpengine.com/packages/#tab-2
http://gravynet.staging.wpengine.com/packages/#tab-3

Thanks!

[RadModerator]

Hi there,

Please try this one,

      jQuery(function($){

	$(document).ready(function(){ jump_to_tab( $, $('.x-nav-tabs .x-nav-tabs-item a[href="#' + location.href.split("#").slice(-1)[0] + '"], a[href="#' + location.href.split("#").slice(-1)[0] + '"].x-accordion-toggle') ); });
	$('.enable_jump_to').click( function(e){ e.preventDefault(); jump_to_tab($, $('.x-nav-tabs .x-nav-tabs-item a[href="' + $(this).attr('data-jump-target') + '"], a[href="' + $(this).attr('data-jump-target') + '"].x-accordion-toggle') ); } );

});

function jump_to_tab($, tab_nav) {
			if(tab_nav.length >=1) {
	            $(tab_nav).click();
	            $('html,body').stop().animate({scrollTop: $(tab_nav).offset().top - ( $('.x-navbar').height() + 50 )},700 ,'swing');
        	}
}      

Previous animation should stop before starting another. Let me know.

Thanks!

[hgstudioParticipant]

Thanks for your response! Unfortunately that did not work. Now the offset is not occurring at all :/

[NicoModerator]

Hi There,

Thanks for the update.

Would you mind opening a new thread and share us your admin credentials so we could check your setup.

Don’t forget to set it as private reply.

Thanks.

[hgstudioParticipant]

This reply has been marked as private.

[RadModerator]

Hi there,

Yes please, start a new thread and provide your login credentials there. It’s just this thread is getting longer and harder to manage.

Thanks!

[Tandem26Participant]

Hi there, I cannot get this to work as I have no idea where to put the link Jump and Open Tab/Accordion #1 …

I’ll try to explain what I wanted to achieve:

I had a contact section on my homepage and ‘contact’ in the nav bar, and the one page navigation worked fine with the contact section ID ‘contact’ and the menu Custom Link URL ‘#contact’.
Now I would like to change it so that the contact section is a tab in the accordion. the accordion item is called ‘Contact’ and I would like to change the nav bar link on that page so that it
– jumps to the correct place on the page
– opens the accordion tab

So far I don’t understand where you <a … link is to go and where I need to insert the class ‘enable_jump_to’ … sorry I don’t get it at all, if you could enlighten me that would be great.

I copied the following in to Custom – Edit Global Javascript (hoping it is the latest version for that code?):

jQuery(function($){

$(document).ready(function(){ jump_to_tab( $, $(‘.x-nav-tabs .x-nav-tabs-item a[href=”#’ + location.href.split(“#”).slice(-1)[0] + ‘”], a[href=”#’ + location.href.split(“#”).slice(-1)[0] + ‘”].x-accordion-toggle’) ); });
$(‘.enable_jump_to’).click( function(e){ e.preventDefault(); jump_to_tab($, $(‘.x-nav-tabs .x-nav-tabs-item a[href=”‘ + $(this).attr(‘data-jump-target’) + ‘”], a[href=”‘ + $(this).attr(‘data-jump-target’) + ‘”].x-accordion-toggle’) ); } );

});

function jump_to_tab($, tab_nav) {
if(tab_nav.length >=1) {
$(tab_nav).click();
$(‘html,body’).animate({scrollTop: $(tab_nav).offset().top – ( $(‘.x-navbar’).height() + 50 )},700 ,’swing’);
}
}

Thanks so much!

[Rue NelModerator]

Hello There,

Thanks for updating this thread! Your code no longer works because of the changes we have made in the latest release of Cornerstone. To resolve this issue, please follow on this topic: https://community.theme.co/forums/topic/jvs-for-tabs-links-stopped-working/#post-864178

If you have any additional questions at this time we kindly ask that you open them up in a separate thread. The longer threads get in the forum, they become more difficult to support as they tend to drift off topic and they also make it troublesome for users trying to search for solutions. Keeping threads relevant to their original inquiry ensures that we can keep better track of what has been resolved and that users can more effectively find answers to similar issues they might be experiencing.

Thanks!

[Author]

Posts