Cacher is the code snippet organizer for pro developers

// Moving border menu hover

var marker  = $('.js-marker'),
    current = $('.current');

// Initialize the marker position and the active class
current.addClass('active');
marker.css({
    // Place the marker in the middle of the border
    top: -(marker.height() / 2),
    left: current.position().left,
    width: current.outerWidth(),
    display: "block"
});

$('li', '.js-marker__wrapper').mouseover(function () {
    var self = $(this),
        offsetLeft = self.position().left,
        // Use the element under the pointer OR the current page item
        width = self.outerWidth() || current.outerWidth(),
        // Ternary operator, because if using OR when offsetLeft is 0, it is considered a falsy value, thus causing a bug for the first element.
        left = offsetLeft === 0 ? 0 : offsetLeft || current.position().left;
    // Play with the active class
    $('.active').removeClass('active');
    self.addClass('active');
    marker.css({
        left: left,
        width: width,
    });
});

// https://codepen.io/Wilhearts/pen/LcdJr