Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Already on GitHub? Sign in to your account

toolbar next to text with long content #81

dbu opened this Issue Jul 23, 2012 · 1 comment


None yet
2 participants

dbu commented Jul 23, 2012

currently the toolbar is always at the top of a text block when fixed to the text, it does not scroll so you can scroll it out at the top of the window. we should either fix it at top of window when it gets hidden, or make it switch to become the toolbar embedded into the header create.js bar. @bergie do you think switching the type of toolbar would be hard to do dynamically? the + would be that the positioning has to be solved only once - otherwise hallo and create toolbars would start to collide. on the other hand, this only works if you have create, not when using hallo stand-alone.


bergie commented Jul 24, 2012

The fixed toolbar should do something similar to the nav bar on Midgard website: http://midgard-project.org/midgardmvc/

The code for doing this is quite simple. Something like:

var initial = navigationBar.position();

var scrollTop = function() {
  return document.body.scrollTop || document.documentElement.scrollTop;

var checkPosition = function() {
  if (!navigationBar.hasClass('fixedmenu') &&
    (navigationBar.offset().top - scrollTop() < 0)) {
    navigationBar.css('top', 0);
    navigationBar.css('float', 'none');
    navigationBar.css('right', '10%');
    navigationBar.css('position', 'fixed');
  } else if (navigationBar.hasClass('fixedmenu') &&
    scrollTop() <= initial.top) {
    navigationBar.css('position', 'absolute');
    navigationBar.css('right', '10%');
    navigationBar.css('top', initial.top + 'px');

window.onscroll = checkPosition;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment