tabbox scroll unsynced when resizing with toolbar

XMLWordPrintable

    • Type: Bug
    • Resolution: Fixed
    • Priority: Normal
    • 9.6.4
    • Affects Version/s: 9.6.3
    • Component/s: None
    • Security Level: Jimmy
    • None
    • None

      Steps to Reproduce

      https://zkfiddle.org/sample/jq2t88/1-Another-new-ZK-fiddle

      Run fiddle
      Resize browser window enough for about 5 tabs to be visible
      Use the scroll button (right) to scroll to the last item (tab16)
      Select tab15
      Resize the browser window slightly larger

      Current Result

      Scroll position is offset left by the size of the toolbar to the right of the scroll container
      Scroll to the right is not possible

      Expected Result

      scroll position is maintained between resizes,
      scroll to right is still possible if the position is not right-most

      Debug Information

      tabs.scrollLeft is reset by the _syncScroll function on tabbox (because the container is calculated without the toolbar to the right.
      Tabbox state is still fully scrolled, when it's actually offset by the width of the toolbar.

      Workaround

      <script><![CDATA[
		//workaround
		zk.afterLoad("zul.tab", function () {
		    var _xTabs = {};
		    zk.override(zul.tab.Tabs.prototype, _xTabs, {
		        _scrollcheck: function(way, tb) {
					var result = _xTabs._scrollcheck.apply(this, arguments);
				    if (!this.desktop || tabbox && (!tabbox.isRealVisible() || !tabbox.isTabscroll())) return;
				    var tabbox = this.getTabbox();
				    var tabs = this.$n(),
				            tbx = tabbox.$n();
					if (!tabbox.isVertical() && !tabbox.inAccordionMold()){
				          sel = tabbox.getSelectedTab(),
			                  node = tb ? tb.$n() : sel ? sel.$n() : null,
			                  nodeOffsetLeft = node ? node.offsetLeft : 0,
			                  nodeOffsetWidth = node ? node.offsetWidth : 0,
					          tabsOffsetWidth = tabs.offsetWidth,
			                  tabsScrollLeft = this._tabsScrollLeft;
				          tabs.scrollLeft = tabsScrollLeft;
					}
					return result;
		        }
		     });
		});
	]]></script>

            Assignee:
            DevChu
            Reporter:
            MDuchemin
            Votes:
            0 Vote for this issue
            Watchers:
            3 Start watching this issue

              Created:
              Updated:
              Resolved: