51
Views
6
Comments
Solved
Implementing Scrollable Area  in Tabs-Header
Question
Application Type
Mobile

I want to implement scrollable area in tab-headers.

I tried inserting the tab headers in Scrollable Area widget

When I select the 3rd tab , navigation to the 3rd happens but the underline highlight (red line)  does not move with the selected tab.

2. I also tried using CSS  "overflow-y: auto;", it is not giving the desired output.

Is there any CSS/ any other solution to make tab-headers scrollable horizontally ?

Regards,

Cynthia Maria

Tabs.oml
UserImage.jpg
Neha Bhimsaria
Solution

Hello Cynthia, 

I have attached oml with some modifications, I have put scrollable area at the start. 

Please check and let me know if your issue is solved or not. 

Thanks 

Neha

Tabs (1).oml
UserImage.jpg
Neha Bhimsaria

Hello 
Cynthia Maria , 

As I can see tabs are moving as per selected tab. 

Thanks 

Neha

UserImage.jpg
Cynthia Maria

Hi Neha,

Sorry I had attached the wrong oml file( now I replaced it), if I put the tab headers in the scrollable area widget the underline highlight stops working.

Regards,

Cynthia

UserImage.jpg
Neha Bhimsaria
Solution

Hello Cynthia, 

I have attached oml with some modifications, I have put scrollable area at the start. 

Please check and let me know if your issue is solved or not. 

Thanks 

Neha

Tabs (1).oml
UserImage.jpg
Cynthia Maria

Hi Wasim,

I replaced my oml now, I  used Scrollable Area widget, it messes with the underline highlight.

Regards,

Cynthia 

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.