Tagged: , ,

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • October 5, 2015 at 3:06 pm #513846
    richardelectrix

    Hi

    Is there any way to get the tabs to work like proper tabs or at least fixed buttons on a mobile device?

    Currently they work like an accordion. Our first tabs has ‘all’ products within in. Therefore when they page loads the user has to scroll a lot to see the other tab options.

    I have previous tried this code but it breaks the child functions php.

    <script>
jQuery(window).load(function(){
	if(jQuery.avia_utilities.isMobile){
		jQuery('.tab').removeClass('active_tab');
		jQuery('.tab_content').removeClass('active_tab_content');
	}
});
</script>
    October 5, 2015 at 4:32 pm #513904
    Elliott

    Hi richardelectrix!

    They display like an accordion because on mobiles there is usually a small screen so all of the tabs cannot fit on the same line. Because of this we change the styling so they display on top of each other.

    Regards,
    Elliott

    October 5, 2015 at 4:40 pm #513916
    richardelectrix

    Is there no way to get it so the accordion displays closed and the tabs appear as buttons on top of each other that are static??

    Thanks

    October 6, 2015 at 12:34 pm #514334
    Andy

    Hey!

    not sure what you mean. Can you provide us a link where we can see the tabs you are talking about? and then show us an example where it looks and behaves as you want?

    Best regards,
    Andy

    October 6, 2015 at 12:47 pm #514347
    richardelectrix

    Hi

    Here is where the tabs are displaying …

    http://dev2.electrixinternational.com/products/trunking-systems/flat-lid-trunking-system/

    If I go to the above page on the mobile I have to scroll for ages before I can see the other tabs (because it is an accordion).

    In an ideal world the tabs on a mobile should be stacked on top of each other …

    All Products
    Lengths
    Bends
    Tees
    Etc

    {All products tab displays here}

    When you click on Lengths, it turns to blue and display the length option underneath the tab options.

    All Products
    Lengths
    Bends
    Tees
    Etc

    {Lengths tab displays here}

    … so the tab buttons always remain at the top.

    October 6, 2015 at 5:18 pm #514606
    Elliott

    Hey!

    That would take a lot of time and code to change so it would have to be considered custom work. It would be best to hire a freelancer to help you out with this customization.

    Cheers!
    Elliott

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘Tabs on a Mobile Device’ is closed to new replies.