As I am having a custom "position:fixed" top navigation bar in my admin pages, the sticky table header are being hidden behind it when I scroll-up.

I went through tableheader.js and saw there is a Drupal.settings.tableHeaderOffset that helps change the "top" property, but I don't know where I should override it. Possible to do it in my template.php?

Also, I would like to change the position that triggers the sticky header to change visibility from hidden to visible...

  // Track horizontal positioning relative to the viewport and set visibility.
  var hScroll = document.documentElement.scrollLeft || document.body.scrollLeft;
  var vOffset = (document.documentElement.scrollTop || document.body.scrollTop) - this.vPosition;
  this.stickyVisible = vOffset > 0 && vOffset < this.vLength;
  this.stickyTable.css({ left: (-hScroll + this.hPosition) + 'px', visibility: this.stickyVisible ? 'visible' : 'hidden' });

You can override tableheader.js using hook_js_alter(&js) {}, just replace path of file, like in example (details here).

Also you can override Drupal.settings.tableHeaderOffset value. Thus, in template.php place something like this:

drupal_add_js('themeTableHeaderOffset() { return 200; }', 'inline');
drupal_add_js(array('tableHeaderOffset' => 'themeTableHeaderOffset'), 'setting');
  • I ended up using hook_js_alter to replace the default misc/tableheader.js file with a custom one in my theme, but your solution seems to answer to my question on why when I used 'setting' and did 'tableHeaderOffset' => '200' I got a "number is not a function" error msg. I guess that's the way to circumvent it.. Apr 9 '13 at 16:50
  • Just take a look in tableheader.js on line 83: this.stickyOffsetTop = Drupal.settings.tableHeaderOffset ? eval(Drupal.settings.tableHeaderOffset + '()') : 0; There is eval expression, so Drupal.settings.tableHeaderOffset should be a callback function name, like in my example. Obviously 200() is not a function :) Apr 9 '13 at 21:11
  • Yep, I'd seen it, I just didn't think about it myself :) thanks! Apr 10 '13 at 5:44
  • Actually I get a Uncaught ReferenceError: themeTableHeaderOffset is not defined. (I put it in a preprocess page) should I if to check if the tableheader.js is loaded.. Apr 10 '13 at 8:57
  • Fixed it like that:drupal_add_js('var themeTableHeaderOffset = function() { var offsetheight = jQuery("#header").height(); return offsetheight; }', 'inline'); Apr 10 '13 at 9:30

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.