mkoryak/floatThead

top position according to responsive vs. scroll

pete111 opened this issue · 4 comments

hi, is it possible to adjust top position according to responsive vs scroll mode please?
I would like to use both scrollContainer as well as responsiveContainer, but with specific top position.
something like:

    $table.floatThead({
        scrollContainer: function($table){
            top: 105;
            return $table.closest(".wrapper");
        },
        
        responsiveContainer: function($table){
            top: 55;
            return $table.closest(".table-responsive");
        }
    });

any idea please how could I adjust top position for both modes?

Top can be a number or a function that returns top. Make it be a function and then you just need to figure out which mode you're in. Possibly check the window clientWidth to determine that

could you please provide me with example? I am not very familiar with javascript

Sure, something like this (i did not run this code):

  $table.floatThead({
        responsiveContainer: function($table){
            return $table.closest(".table-responsive");
        },
        top: function(){
          // use your responsive breakpoint here instead
          if(document.body.clientWidth <= 500){
             return 55;
          } else {
             return 105;
          }
       }
    });

You're welcome