Body: <p>I have a requirement that a menu is open on wider breakpoints and closed on mobile breakpoints. To make it open i have a class i would toggle on my menu.</p>
  
  <p>I can do this with JS but i get a FOUC on the menu on mobile, since it opens at first and then closes. So what i would ideally do is do this server side and exclude the class.</p>
  
  <p>Is there some way with craft templates to set a variable containing the breakpoint or screen size?</p>
  
  <p>Fx..</p>
  
  <blockquote>
    <p>{%set isMobileSize =  ??? %}</p>
  </blockquote>
  
  <p>Ideally this would get the page size in the request and set this when rendering the page/template?</p>
  
Comments.ContentLicense: CC BY-SA 3.0
Comments.CreationDate: 2016-03-28T16:23:10.673Z
Comments.Text: Just so I understand, is the question "Can I set a Twig variable to the browser's current screen size?"
Comments.UserDisplayName: Brad Bell
Comments.ContentLicense: CC BY-SA 3.0
Comments.CreationDate: 2016-03-28T16:39:50.833Z
Comments.Text: Is there a reason why you can't set the menu to be "closed" initially with CSS on mobile breakpoints and then have it "open" on larger ones? That's usually a "mobile first" approach...
Comments.UserDisplayName: RitterKnight
Comments.ContentLicense: CC BY-SA 3.0
Comments.CreationDate: 2016-03-28T19:39:36.760Z
Comments.Text: Yes thats the question in a way but i need to be able to quality > a size
Comments.UserDisplayName: Tim
Comments.ContentLicense: CC BY-SA 3.0
Comments.CreationDate: 2016-03-28T19:40:36.870Z
Comments.Text: In that case i have the reserve FOUC content problem where the menu appears closed and then open.
Comments.UserDisplayName: Tim
Tags: <templating>
Title: Set a Template Variable Based on Breakpoint
ThreadText: # Set a Template Variable Based on Breakpoint
  
  (Asked by: username_0 on 2016-03-28)
  
  I have a requirement that a menu is open on wider breakpoints and closed on mobile breakpoints. To make it open i have a class i would toggle on my menu.
  
  I can do this with JS but i get a FOUC on the menu on mobile, since it opens at first and then closes. So what i would ideally do is do this server side and exclude the class.
  
  Is there some way with craft templates to set a variable containing the breakpoint or screen size?
  
  Fx..
  
  > {%set isMobileSize = ??? %}
  
  Ideally this would get the page size in the request and set this when rendering the page/template?
  
  **Tags:** templating
  
  > **Comments:**
  > **username_1**: Just so I understand, is the question "Can I set a Twig variable to the browser's current screen size?"  
  > **username_2**: Is there a reason why you can't set the menu to be "closed" initially with CSS on mobile breakpoints and then have it "open" on larger ones? That's usually a "mobile first" approach...  
  > **username_0**: Yes thats the question in a way but i need to be able to quality > a size  
  > **username_0**: In that case i have the reserve FOUC content problem where the menu appears closed and then open.  
  
  ---
  
  ## 0 answers
  
  