Jump to content


Photo
- - - - -

NavBar portrait mode iPad


  • Please log in to reply
7 replies to this topic

#1 keithmagvacom

keithmagvacom

    Advocate

  • Members



  • 395 posts
  • Framework Version:2.4
  • Country: Country Flag

Posted 23 June 2013 - 09:36 AM

Hi Folks

 

Is anyone aware of a solution or a method of stopping the NavBar wrapping onto the next line when in portrait mode on an iPad. It's perfect when in landscape. Is there a method of specifying its max width ONLY when an iPad in portrait mode is detected. I guess you'd have to detect the orientation of the iPad also. Can't seem to located anything in the forums.

 

Thanks in advance



#2 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 23 June 2013 - 02:13 PM

Hi Keith,

 

Is your site set up to be responsive or did you tick the option to disable mobile view?

 

If this is magva.com we're speaking about, there's the possibility that the hook or addition of the shopping cart total is causing this issue.  Can you confirm the site?

 

Thanks.



#3 keithmagvacom

keithmagvacom

    Advocate

  • Members



  • 395 posts
  • Framework Version:2.4
  • Country: Country Flag

Posted 23 June 2013 - 02:23 PM

Hi Rob

 

The mobile view is enabled. The site in question is belmonthousestud.com but am working on a clone of it while I migrate it from PlatformPro Belmonthousestud.com/BHSclone Its working fine on a mobile, just not on the the iPad. The Navbar appears as it would on a regular web browser.



#4 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 23 June 2013 - 03:13 PM

Keith,

 

I suspect (without seeing it) that there's something in the menu causing it to wrap under certain circumstances.

 

Three things could cause this.

 

1.  There is an image that is being scaled down in the menu or, the branding image is pushing the navbar. 

2.  The text/font in the menu is large, and needs to be resized to meet the mobile view's needs.

3.  There is some code affecting the navbar which is causing the wrap in iOS.  Do you have an iPhone too?

 

I doubt it's a plugin conflict, so I won't ask you to disable (yet). :)



#5 keithmagvacom

keithmagvacom

    Advocate

  • Members



  • 395 posts
  • Framework Version:2.4
  • Country: Country Flag

Posted 23 June 2013 - 03:25 PM

I think its relatively simple in so far that in its the width of the NavBar. 

 

Works find in landscape mode, only in portrait mode wraps onto the next line. On an iPhone its fine (the menu drop is functioning) 



#6 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 23 June 2013 - 04:04 PM

Keith,

 

My best guess is that in the portrait mode, the browser doesn't have sufficient room for the links on one line.  The solution would be to use browser-specific CSS to change the font-size down so that it fills less space.

 

I don't know the names of the links, but you may want to reduce the label names. That can help considerably.



#7 keithmagvacom

keithmagvacom

    Advocate

  • Members



  • 395 posts
  • Framework Version:2.4
  • Country: Country Flag

Posted 23 June 2013 - 04:08 PM

Might have to go that route. Its a minor detail for the moment, so will keep searching for a solution. What I might try and find is a method of detecting if the iPad is in portrait or landscape mode and if in portrait have a popup appear recommending the site be viewed in landscape mode!



#8 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 23 June 2013 - 04:11 PM

Keith,

 

It might just be easier to use the browser specific code method to reduce the font size for the navbar in iOS only. Finding code to detect the layout might be more of a challenge than you think.