Docs

[dalatarzan]

Hi.
I have an issue with unwanted scrolling when on a woocommerce product page and click on the TAB´s for Description, Additional Information and Reviews. Have a look here please: http://2.b-light.se/shop/men/tops-yoga-sportswear/organic-cotton-yoga-t%E2%80%91shirt-devadara-classic-blue/

Everytime you click one of the above mentioned TAB´s the page scrolls down a bit.

I read about something almost similar in this forum but it was regarding to accordion. I don´t have that issue though.

Any ideas how this can be fixed?

Thanks a lot.
Jonas

[Paul R]

Hi Jonas,

To fix it, you can add this under Custom > Edit Global Javascript in the Customizer.

$( function($) {

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

});

If that doesn’t help please provide us your wordpress admin login in private reply so we can take a closer look.

Thanks

[dalatarzan]

Thanks. I will add it and let you know. I just noted that the very same TAB´s don´t work at all on mobile? Same error?
Just tried the code above but no change. Will send login details.

Thanks!

[dalatarzan]

This reply has been marked as private.

[Rad]

Hi there,

I added this,

jQuery( function($) {

	$(document).ready( function() {
    
    setTimeout ( function(){  $('.x-nav-tabs>li>a').on('click', function(){
      
      $('html, body').stop();
      
    } ); }, 100 );
    
  } );

});

Please check now, thanks!

[dalatarzan]

Hi. It works fine on desktop pc but not on mobile. On mobile they are not even clickable.

Jonas

[Rue Nel]

Hello Jonas,

Could you please update the JS code and use this instead:

jQuery( function($) {

	$(document).ready( function() {
    
    setTimeout ( function(){  $('.x-nav-tabs>li>a').on('click touchend', function(){
      
      $('html, body').stop();
      
    } ); }, 100 );
    
  } );

});

Hope this helps.

[dalatarzan]

Sorry, but it still doesnt work on mobile devices.
Any new ideas?

Jonas

[Paul R]

Hi,

Please change the code to this.

jQuery( function($) {

	$(document).ready( function() {
    
    setTimeout ( function(){  $('.x-nav-tabs>li>a').on('click touchstart touchend', function(){
      
      $('html, body').stop();
      
    } ); }, 100 );
    
  } );

});

Make sure to clear your mobile browser cache before checking.

Thanks

[dalatarzan]

Nope, no change on mobile devices. Did you check on your phone? Did it work there?
The Tabs are not clickable at all on mobile for me.

Jonas

[Lely]

Hello Jonas,

I did check again and it is not working on my mobile. Please try adding the following code too.

$(document).ready(function() {
    $('.x-nav-tabs>li>a').off('click touchstart touchend');
});

Hope this helps.

[dalatarzan]

You meen like this:
jQuery( function($) {

$(document).ready( function() {

setTimeout ( function(){ $(‘.x-nav-tabs>li>a’).on(‘click touchstart touchend’, function(){

$(‘html, body’).stop();

} ); }, 100 );

} );

});

It makes not change on my Samsung S5, Android device.
The Tabs are still completely freezed, not clickable.

Jonas

[Rad]

Hi there,

This is wrong,

      jQuery( function($) {

	$(document).ready( function() {
    
    setTimeout ( function(){  $('.x-nav-tabs>li>a').on('click touchstart touchend', function(){
      
      $('html, body').stop();
      
    } ); }, 100 );
    
  } );

});
$(document).ready(function() {
    $('.x-nav-tabs>li>a').off('click touchstart touchend');
}); 

try this one

jQuery( function($) {

$(document).ready( function() {
    
    setTimeout ( function(){  $('.x-nav-tabs>li>a').off('touchstart touchend').on('click touchstart touchend', function(){
      
      $('html, body').stop();
      
    } ); }, 100 );
    
  } );

});

Thanks!

[Author]

Posts