X-interactive state on mobile devices

[5atchmin]

Hello !

Just a quick question, the “x-interactive” class is added to buttons when they are hovered over. I would like to know how to add “x-interactive” class so it is present on all mobile devices. I use v2 buttons to create a grid like design, the text for the button appears on hover.

Thanks !

[paul.r]

Hi,

You can add a custom css to make normal state the same as hover state.

Can you provide us your site url so we can provide a tailored code to your situation.

Thank you.

[5atchmin]

https://www.thangka-mandala.com/

[jade]

Hi there,

You could accomplish this by adding a few lines of custom JS.

Use this if you want to enable the x-interactive when the buttons are tapped on mobile:

(function($){
    $('.x-anchor').bind('touchstart', function(e) {
        $(this).addClass('x-interactive');
    });
})(jQuery);

Or use this if you want the x-interactive class added to the buttons on idle state:

(function($){

    var width = $(window).width();
    if(width <= 480) {
        $('.x-anchor').addClass('x-interactive');
    }

})(jQuery);

Hope this helps.

[5atchmin]

Thank you !!

[rad]

You’re most welcome!