[garlant]

thats my code, but is the same for original. I need to active link after banner is in center, not in transition to center. Im using (center mode from http://kenwheeler.github.io/slick/)

  <div class="stack">

    <div class="boxes">
       <h1><a id="l1" href="http://example.com">1</a></h1>

       </div>
    <div class="boxes">
         <h1><a id="l2" href="http://example.com">2</a></h1>

    </div>
    <div class="boxes">
        <h1><a id="l3" href="http://example.com">3</a></h1>

    </div>
    <div class="boxes">
         <h1><a id="l4" href="http://example.com">4</a></h1>

    </div>
    <div class="boxes">
        <h1><a id="l5" href="http://example.com">5</h1>

    </div>
    <div class="boxes">
        <h1><a id="l6" href="http://example.com">6</a></h1>

    </div>
</div>
  
  <script type='text/javascript'>
    

    var slick = $('.stack').slick({
        centerPadding: '160px',
        centerMode: true,
        infinite: true,
        arrows: false,
        draggable: false,
        touchMove: true,
        variableWidth: true,
        dots: false,
        swipeToSlide: true,
        slidesToShow: 3,
        slidesToScroll: 3,
        focusonselect: true,
        mobileFirst: true
       });

    var slider = $('.slider').slider({
        max: 100,
        min: 0,
        value: 93
    });

    $(".slider").on("slide mouseenter mousedown", function (event) {
        event.stopPropagation();
    });

    var highlightDiv = document.getElementById('highlight');
    var slideIndex = highlightDiv.getAttribute('data-slick-index');
     var l3 = document.getElementById('l3');

    if ((highlightDiv.className == 'slick-center') || (slideIndex == 1)) {
        $('#highlight').addClass('red');
       }


</script>

[JackOfAllTrades]

Moved to jQuery forum.

[fatihmert]

Did you can CSS's text-align method to align center stack class?

.stack{
    text-align:center;
}

[garlant]

I chance the solution!

https://css-tricks.com/moving-boxes/

this solve my problem