Tabpanel pane style - height & width

Tabpanel pane style - height & width

Posted by: jerrysimmons on 20 February 2019, 5:38 pm EST

• 

  jerrysimmons

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 20 February 2019, 5:38 pm EST

  I have a tabpanel and I need to set the height and width of each pane, below is the code I’m using but it’s not working, the structure seems to be correct but the panes are not adjusted as expected.

      Mtabs = new wijmo.nav.TabPanel('#Mtabs', {
          tabs: [
              { header: "", pane: {
                      style: {
                          width: $(window).width(),
                          height: $(window).height()
                      }
                  }
              },
              {
                  header: "", pane: {
                      style: {
                          width: $(window).width(),
                          height: $(window).height()
                      }
                  }
              },
              {
                  header: "", pane: {
                      style: {
                          width: $(window).width(),
                          height: $(window).height()
                      }
                  }
              },
              {
                  header: "", pane: {
                      style: {
                          width: $(window).width(),
                          height: $(window).height()
                      }
                  }
              },
              {
                  header: "", pane: {
                      style: {
                          width: $(window).width(),
                          height: $(window).height()
                      }
                  }
              }
          ],
          selectedIndexChanged:function(e){                
              if (e.selectedIndex === 5) {                    
                  
              }
          }
      });
  

• 

  sharad.tomer

  

  • Post Options:
  • Link
    Copy

  Posted 21 February 2019, 2:28 am EST

  Hi,

  We need to iterate over each tab and set the style accordingly.
  
  Please refer to the following code snippet:

  var tabPanel = new wijmo.nav.TabPanel('#theTabPanel');
  tabPanel.tabs.forEach((tab)=>{
    tab.pane.style.width = window.innerWidth + 'px';
    tab.pane.style.height = window.innerHeight + 'px';
  });
  

  ~Sharad

• 

  jerrysimmons

  • Post Options:
  • Link
    Copy

  Posted 21 February 2019, 10:47 am EST

  Great thanks!