Tab Contenet Positioning

[sathyaprakash94]

Hi there,

Thanks for the awesome work. The plugin is awesome but have minimal feature. If get into the development with your plugin lot more needed. At least basic feature should be there is appreciable.

I have found some features not there,

1. Tab content not visible (May be width / height not set)
2. After set width and height, the tab content just displaying the same size what we assigned to tab not taking full width. So all the tabs displaying the corresponding tab contents.
3. If I close the previous tab the current and next tab contents not taking fulll width.

Pls see my work with your plugin, I'm facing this issues. I have modified as my need but still having the problem when closing the tabs.

I have created tabs and the are tab contents successfully but the tab contents are not positioning properly (ie) not started from starting position of the page.

Problem - 1:
The tab contents started from where the tabs are created as it is in plugin demo page.

Problem-2:
The tab contents not positioning properly, If I close the tab previous to the current tab or next to the current tab.

Thanks.

[adamschwartz]

Hey @sathyaprakash94. I’d be happy to help if you would please provide a snippet of code and a specific feature request or bug report steps. You may find these contribution guidelines to be a helpful resource. Thanks!

[sathyaprakash94]

Hi thanks for your reply. Sure i will provide the snippet for you to make the problem clear.

[sathyaprakash94]

Hi there ,

Tab content set to the full width using,
$('.chrome-tab-content').width(document.documentElement.clientWidth);

but the tab content start from the left position 0 of corresponding parent element.

I tried to fix the position of the tab content starts from and take entire space to visible the current tab using,

if ($('.chrome-tab-current').offset().left !== 69) {
      var vleft = $('.chrome-tab-current').children().eq(4).children().offset().left;
      $('.chrome-tab-current').children().eq(4).children().css({ 'position': 'absolute', 'left': '-' + (vleft - 50) + 'px', 'top': '26px', 'z-index': '1' });
  } else {
           console.log('Offset left not matched.');
  }

Now the positioning issue solved by setting the positioning manually. But when closing the prev tabs, the position of sibling tabs went outside of left due to -posision applied to fix the full width.

I hope you understand. If Im not clear, pls check the image posted earlier.

[adamschwartz]

Thanks for the code snippet. I believe the question you’re asking falls outside of the scope of this project. This project provides the form and behavior of the tab elements themselves, not what one might display below the tabs. If you’re attempting to implement a browser-like interface, my high level recommendation would be that you place any of your elements after the .chrome-tabs element, not inside of it. Hope this helps!