Hello, can the TabStrip control alter it's orientation based on the viewport/device it's presented on? Let's say I have 5 tabs on a page and when I view this page on an iPhone or Android phone can the tabs align themselves in a stacked fashion (all-closed state). In short, how mobile-friendly is this control - we don't want users to have to scroll horizontally on a mobile device. if this is possible can it be achieved through configuration of the control or is it more of a hand-coded task?
7 Answers, 1 is accepted
Please take a look at the following forum thread on the matter TabStrip tabs - responsive to Mobile devices and the attached sample.
Great, that's just what we were looking for!
Rumen, I showed this to our designer (sorry, web design not my strength) and she indicated how we as an organization want to display tabbed content as indicated in our styleguide: https://www.nscc.ca/styleguide/content-layouts/content-layout-007.asp. This is done with jquery tabs.
I've attached a couple of screenshots but the idea is that in the mobile view as content is being tabbed through the active tab would be open/visible and all other tabs closed/hidden and the tab-specific content would appear under it's respective tab. This is different from the "tabs as navigation" idea in the "normal/web" view where all content is displayed inside RadMultiPage and RagPageView controls. Is this achievable?
Thanks for your help,
In this scenario using media queries you can use two components: RadTabStrip when the page is displayed on desktop and a PanelBar when the resolution shrinks on mobile:
Ok, we'll give that a try.
Thanks for the help,