Details

    Description

      When using the jboss.org tabzilla JavaScript on optaplanner.org (and soon drools.org and jbpm.org) we faced a number of issues to make it compatible with the stick menu at the top.

      1) The JS needs to be adjusted to add tabzillaHolder id to be compatible with the sticky menu.
      BEFORE (line 239):

          var body = document.getElementsByTagName('body')[0];
          body.insertBefore(Tabzilla.panel, body.firstChild);
      

      AFTER (line 239):

          var tabzillaHolder = document.getElementById('tabzillaHolder');
          if (tabzillaHolder == null) tabzillaHolder = document.getElementsByTagName('body')[0];
          tabzillaHolder.insertBefore(Tabzilla.panel, tabzillaHolder.firstChild);
      

      2) The fullWidth=true parameter doesn't work
      3) The tabzilla CSS dropup was overwritten with z-index=0 because it's default width (250px or 100px on small media) catches mouse click events not meant for it. Alternatively, reducing the width, broke the background image (= the tab) positioning.
      4) The tabzilla CSS dropup was overwritten with right=10px to save real-estate.
      5) Because our website has a sticky menu, the tabzilla remains visible and functional even if you scroll down the page.
      6) Uncollapsing the tabzilla on small media takes up too much space, breaking the website because it overlaps everything and cannot be closed... the tab content should be less (it has a lot of empty space)

      For more context, here's our website (with a sticky menu) using the adjusted JS script:
      http://www.optaplanner.org/
      Awestruct sources:
      https://github.com/droolsjbpm/optaplanner-website

      Attachments

        Activity

          People

            Unassigned Unassigned
            gdesmet@redhat.com Geoffrey De Smet (Inactive)
            Votes:
            0 Vote for this issue
            Watchers:
            3 Start watching this issue

            Dates

              Created:
              Updated:
              Resolved: