0
Welcome Guest! Login
0 items Join Now

Interrogating the layout-mode

Last Post
Search Topic
    • HeliFly's Avatar
    • HeliFly
    • Rocketeer
    • Posts: 59
    • Thanks: 0

    Interrogating the layout-mode

    Posted 11 years 1 month ago
    • Hi,

      I am aware that I can let users force a desktop view on a mobile device by using ?layout-mode=1200fixed. If they've done that I'd then like to offer them the option to switch back (should they find the desktop view to be to difficult to use). I realise I can use ?layout-mode=responsive, but I only want the link or div visible to users on mobile devices that have selected the 1200fixed.

      I'm assuming I could do this with some javascript, but am unsure what I should be querying. Any suggestions would be appreciated.

      Regards, John.
    #1077863
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13484
    • Web Designer/Developer

    Re: Interrogating the layout-mode

    Posted 11 years 1 month ago
    • You can use the class on the body tag to do that e.g. "layout-mode-responsive". Yes, you could use JS to do that, but why not just use some CSS to "hide/show" whatever "button" or "link" you are using by adding that into you selector?

      Regards, Mark.
    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
    #1077868
    • HeliFly's Avatar
    • HeliFly
    • Rocketeer
    • Posts: 59
    • Thanks: 0

    Re: Interrogating the layout-mode

    Posted 11 years 1 month ago
    • Thanks for your fast response.

      So if a mobile user has clicked the ?layout-mode=1200fixed link I could then have a div with a class="layout-mode-1200fixed" and some html in it (ie a link to ?layout-mode=responsive). Is that right?

      Thanks, John.
    #1077871
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13484
    • Web Designer/Developer

    Re: Interrogating the layout-mode

    Posted 11 years 1 month ago
    • no - if a user has clicked to change layout mode to 1200pxfixed then the body tag will have a class of "layout-mode-1200fixed" on it. therefore you can then but a link on you page
      <a class="myrevert">switch back to responsive</a>
      and style it with CSS
      body.layout-mode-1200fixed .myrevert {display: block;}
body:not(.layout-mode-1200fixed) .myrevert {display: none;}

      Obviously you'll need to deal with all the other variations too.

      This is how to create a custom CSS compatible with Gantry 4...

      Simply create a file called "<TEMPLATENAME>-custom.css" and put this file in the CSS folder of the template (where <TEMPLATENAME> is the name of the template as seen in template manager e.g. rt_fracture). GANTRY4 will automatically load this CSS file. If you wish, you can also have browser specific files by appending, for example, "-ie9" making the filename "<TEMPLATENAME>-custom-ie9.css"


      Regards, Mark.
    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
    #1077878

Time to create page: 0.066 seconds