Auto tabs with stop on hover

Hello guys,

I know this functionality is somewhere in the forums and clonables, but I’ve tried them all and no one seems to work without bugs.

I have now a solution that works great with my design. It is fully working auto switching tabs. The problem is that I would like to make the tabs to stop auto switching when hovered on specific tab. I kind of understand the code, but I’m not fluent in Javascript so it is hard for me to make this functionality myself.

I guess I need just a few more lines of code to make it work properly. Maybe anyone of you can help?

Here is the code I have now:

    var Webflow = Webflow || [];
    Webflow.push(function() {
        var tabTimeout;

        // define loop - cycle through all tabs
        function tabLoop() {
            tabTimeout = setTimeout(function() {
                var $next = $('.tabs-menu').children('.w--current:first').next();

                if ($next.length) {
                    $; // click resets timeout, so no need for interval
                } else {
            }, 12000);

        // reset timeout if a tab is clicked
        $('.tab-link').click(function() {

Here is my site Read-Only: LINK
(how to share your site Read-Only link)