[EileenParticipant]

Hi There

I have looked round the forum and there appears to be a bug with JS. I tried putting this suggested code in:

jQuery( function ( $ ) {

$(document).on(‘click’, ‘.x-accordion-toggle’, function( e ){
$(‘html, body’).stop();
});

});

however its not making much of a difference. The tabs are still jumping or starting halfway down the info of that particular tab.

Can you please advise.

Many thanks.

[EileenParticipant]

This reply has been marked as private.

[ThaiModerator]

Hi There,

Thanks for writing in.

Could you please send me the link with the Accordion?

I can’t find them.

Many thanks.

[EileenParticipant]

This reply has been marked as private.

[LelyModerator]

Hello Eileen,

Thank you for the URL.
The fix for that issue is this code below, unfortunately I can’t seem to duplicate the issue on my end.

jQuery( function ( $ ) {

$(document).on('click', '.x-nav-tabs-item a', function( e ){
$('html, body').stop();
});

});

Can you send us a video screencast of the issue?

Thanks.

[EileenParticipant]

Hi There

I have tried it on several machines and it is exactly the same. When you first log into the page click on the tab marked Covers and you are taken to halfway down the information under that tab.

Then click on Course Contents and you are taken to below the information for that tab so you cannot see it. The same for the other tabs.

Not sure why you cannot see that happening. I do not know how to send a video screencast of the issue but the javascript is definately NOT working.

I have put it in the customiser javascript section – is there anywhere else where it should go?

Thanks.

[EileenParticipant]

This reply has been marked as private.

[EileenParticipant]

Hi there

I have been trawling through the forum and found this post which had some additional script in and this seems to have worked for me.

https://community.theme.co//forums/topic/page-scrolls-up-and-down-when-clicking-on-tab-nav-items-and-accordian-items/

Many thanks.

[ThaiModerator]

Glad you’ve sorted it out.

If you need anything else, please let us know 🙂

[EileenParticipant]

Well I thought I had but the customer is still not happy with the procedure as it is not that smooth

When the description tab is open and I click the next ones in order but whilst leaving the description tab still open, the other 3 following tabs open and shoot down to the bottom of the page fast and then back up to where they should be. But when any other tab is open and then I open others at the same time, they all open smoothly and without shooting down or up.

The ones that do this are the course contents, duration and support and only when the 1st tab is open. The covers seems ok and the last one Q&A also seems ok ish.
My only concern was if that is not right it would be reproduced throughout. It sort of looks ok but feels wrong? As others are smooth and open and close to their exact spots and I looked on another site using accordions and they open precise.

[EileenParticipant]

This reply has been marked as private.

[EileenParticipant]

This reply has been marked as private.

[Paul RModerator]

Hi,

To fix this, kindly change the entire code in your custom > javascript section with this.

jQuery(document).ready(function($) {
   $('.x-accordion-toggle').click(function() {
      var $adminbarHeight = $('#wpadminbar').outerHeight();
      var $navbarHeight   = $('.x-navbar').outerHeight();
      var $this = $(this);

      setTimeout(function() {
         $('html, body').animate({ 
            scrollTop: $this.offset().top - $adminbarHeight - $navbarHeight + 1
         }, 400)
      }, 300)
   });
   
   $('.x-nav-tabs-item a[href^="#"]').on('click', function(){

        $('html,body').stop().animate({
        scrollTop: $( $(this).attr('href') ).offset().top - $('.x-navbar').height()
        },700 ,'swing');

   });

});

Hope that helps.

[EileenParticipant]

Hi Thanks for the code but its still moving about quite a lot – it should remain static and open smoothly without the tabs moving. The second tab – Covers – is the worst.

I have other sites where I have used the accordion and the tabs remain completely still and the text opens correctly. It just seems to have happened in the new version of Cornerstone.

The more you try it the more it jumps about 🙁

I have 200 pages to do with this in and the customer wants it like the other websites – still and smooth – do you think we can achieve that or not?

Thanks for your help.

[Paul RModerator]

Hi Eileen,

The javascript code was to position your accordion and tabs properly, so when you click on it the first part of your accordion content is shown on the top of the window and not the last part.

If you don’t like any movement you can remove the javascript code in your custom > javascript box in the customizer.

Thanks

[Author]

Posts