JSFiddle - React, Tailwind, and code Playground

by ss s

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<table id="filter_table" style="margin-top:5%">
    <thead class="spec_dash_thead" style="background-color:blue">
        <tr>
            <th>header1</th>
            <th>header2</th>
            <th>header3</th>
            <th>header4</th>
            <th>header5</th>
            <th>header6</th>
            
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>data1</td><td>data2</td><td>data3</td>         <td>data4</td><td>data5</td><td>data6</td>
        <tr>
             <tr>
            <td>data1</td><td>data2</td><td>data3</td>         <td>data4</td><td>data5</td><td>data6</td>
        <tr>
             <tr>
            <td>data1</td><td>data2</td><td>data3</td>         <td>data4</td><td>data5</td><td>data6</td>
        <tr>
             <tr>
            <td>data1</td><td>data2</td><td>data3</td>         <td>data4</td><td>data5</td><td>data6</td>
        <tr> <tr>
            <td>data1</td><td>data2</td><td>data3</td>         <td>data4</td><td>data5</td><td>data6</td>
        <tr> <tr>
            <td>data1</td><td>data2</td><td>data3</td>         <td>data4</td><td>data5</td><td>data6</td>
        <tr> <tr>
            <td>data1</td><td>data2</td><td>data3</td>         <td>data4</td><td>data5</td><td>data6</td>
        <tr> <tr>
            <td>data1</td><td>data2</td><td>data3</td>         <td>data4</td><td>data5</td><td>data6</td>
        <tr>
             <tr>
            <td>data1</td><td>data2</td><td>data3</td>         <td>data4</td><td>data5</td><td>data6</td>
        <tr> <tr>
            <td>data1</td><td>data2</td><td>data3</td>         <td>data4</td><td>data5</td><td>data6</td>
        <tr> <tr>
            <td>data1</td><td>data2</td><td>data3</td>         <td>data4</td><td>data5</td><td>data6</td>
        <tr>
             <tr>
            <td>data1</td><td>data2</td><td>data3</td>         <td>data4</td><td>data5</td><td>data6</td>
      ...

CSS

.fixed{position:fixed}

JavaScript

$(window).scroll(function(){
	var spec_lot_dash_sticky = $('.spec_dash_thead'),
	spec_lot_dash_scroll = $(window).scrollTop()
    if (spec_lot_dash_scroll >= ($("#filter_table").offset().top)){
      spec_lot_dash_sticky.addClass('fixed')
      $(".fixed").css("top","10px")
    }
    else {
      spec_lot_dash_sticky.removeClass('fixed');
    }
});