How can we help you today?

Start a new topic
Discussions Instructional Design Discussions CSS, Javascript and Other Tech Questions

Do tabs work in mobile?

We've created very nice looking 'tab' pages in many courses.  We're starting to notice however that while these tabs look good in a browser, they are not rendering on a mobile device.  Instead you end up with sections that you need to scroll to navigate.   Is there a way to enable tabs in mobile, or is this just how it is for now?

3 CommentsSorted by Newest First

We pass it off as part of the install. I will go ahead and email a link to you (since most mail programs block emails with JavaScript attached). 

It is likely the absence of the mobile JS.   Where is this script for Design Tools?

Hi Joe,


Tabs, accordions, expanders and pretty much all of the dynamic aspects of Design Tools have been configured to work in the mobile app*. Here is a screenshot of iOS and Android (the screenshots are old but I have verified that things are still working in both operating systems). 

iOS:


Android:


If you are not seeing this, here are two things you can check:

  1. Make sure that they are inside the Design Tools Wrapper. If you are in the blocks view you should see a "Begin Design Tools Wrapper" and an "End Design Tools Wrapper" message around your content.
  2. Make sure the JavaScript file is included for the mobile app in the Canvas Theme Editor (it is not the same file that is added for the rest of Canvas). All of the dynamic pieces are built using JavaScript and there is a file that was added as part of the installation that may have been removed by someone editing the Theme in Canvas.

If you have questions about how to check either of these suggestions, let us know. If you verify that both criteria have been met, let us know and we can think through some other potential causes.




*Elements not currently supported in the Mobile App:

  • Quick Links for the Module List (haven't been able to figure out how to make API calls from within the app)
  • Modal Dialogs (originally made this work but the user experience was terrible).
  • Custom CSS (The app blocks access to the file)
Login or Signup to post a comment