Mobile device bugs

[Blue Max]

Hi there!

We’ve tested our website: http://www.blue-max.nl on three mobile devices and found some odd bugs:
Android version. 4.2.2
1. no menu
2. 2nd and 3rd icon are different: 2nd is no icon and 3rd is also a woman, but a full coloured one which isn’t centered?

Ipad mini ios7
1. In landscape view, it doesn’t ‘respond’ but stays old school. The website is shown as if on a desktop.

Is there anything we can do to fix this or is this for a future update of Dante?

Many thanks,
Ruben

[Kyle – SUPPORT]

Ok thanks for this, I will forward it to the developer to see if he can replicate the problems

[Swift Ideas – Ed]

Hi there,

1/2) Can you replicate the same issues on the demo site?

3) This is as supposed to show the mobile menu only shows from iPad portrait and down.

– Ed

[Blue Max]

Hi there Ed!

1/2 are both the same on http://dante.swiftideas.net/ -> no mobile menu and the icons are indeed different from the web version, also they aren’t centered.

Also for 3, I can’t really use the Dante website on the iPad. It’s very slow and not responsive. When it’s loaded after a while, it doesn’t jump to iPad/mobile design (no menu, menu items can’t expand) so it’s untestable (I figure this is done on purpose because no one checks the testing website on mobile currently?)

We’ve also found some other bugs. On the page http://www.blue-max.nl/social-media/ there are 6 animated boxes. On iPad they respond very odd, and aren’t user friendly. On mobile they don’t animate, which is fine because they do work as supposed to.

Last but not least, we have a gallery slider on http://www.blue-max.nl/over-ons/ (2nd image) which on auto play goes crazy (it shows an image for 1/10th second and then scrolls through all images insane quickly and repeats that, the buttons aren’t useable when activated).

This last bug has happened since the last update, before that it worked great.

Many thanks,
Ruben

[Swift Ideas – Ed]

Hi Ruben,

1/2) This seems to be an Android issue, with the system fonts, for the menu you could add text: http://support.swiftideas.net/knowledgebase/how-to-add-menu-text-before-the-mobile-menu-icon/

3) Mobile browsers don’t usually allow for animation while scrolling, so animation is disabled for better user experience. We’ve set it in the latest update so that the icon boxes flip when touched and stay flipped. If this isn’t ideal for you, might be best to choose a different style?

4) Check Theme Options > Slider Options, you can set the speed there.

– Ed

[rblackfox]

Hey Guys,

I am having the same problems on an iPhone 5 and Ipad3 running iOS7. And I have no idea what the problem is.

1) The menu icons do not function correctly or disappearing and do not pull out the necessary sidebar for navigation on phone or iPad.

2.) Animated text, parallax boxed information and a lot of other cool elements do not show up on the mobile devices.

3.) Logo disappears when resizing on device and does not return.

See if you can replicate the same results on our site and homepage,

hanghigherhammocks.com

I am also getting the same results on your demo site on my devices, menu icon only sometimes works on the iPhone and iPad….

Any way to fix this? Its a critical issue that might make me rethink using this layout even thug I love it.

Thanks all!

Justin

[Swift Ideas – Ed]

Hi Justin,

I don’t think you have shared issues, and seems that your custom css may be having negative issues.

1) Working fine here.

2) Can you show me any specific examples?

3) Your logo is hidden because of your custom css – https://www.dropbox.com/s/qz9xmos6lxoqx52/Screenshot%202014-04-01%2022.56.39.png

Just fixed an issue with the menu icon if you try and close it by clicking the menu icon, rather than the close

– Ed

[rblackfox]

Hi Ed:

thanks for the quick reply.

Hmmmmm,

Well, the custom CSS was copied directly from your support forum to produce the Naked layout and I only changed a few text colors.

In addition I did add some to shrink the header down, but I’ll take out any additional CSS that I added beyond the Naked layout additions and let you check it out. Still produces the same results.

Here is what was added.

/*Header Logo Changes: Your CSS CHanges here...*/
nav .menu li:nth-child(5) {
   margin-left:150px !important;
   float:left;
  }
 
   #header #logo {
    height:180px !important;
    position:relative !important;
    top:-10px !important;
    z-index:10 !important;
  }
#header-section #header {
    padding: /*25*/0px 0 !important;
    /*height:150px;*/
}
/*.menu-left #main-navigation {
    padding-left: 15 210px !important;
}*/
#top-bar {
    font-size: 11px ;
    z-index: 0 !important;
    padding: 5px 0;
    position: relative;
}
.sticky-wrapper {
 position: relative;
top:-45px;
}
.header-wrap {
  height:200px;
}
#header-section {
  height:200px;
}

What is interfering so badly with this menu in this CSS? I just wanted to shrink everything down a little bit.

But I also get the same results on your demo naked layout page, menu does not work on my iPhone5 or my colleagues?? I hate intermittent problems just as much as you guys do, and I might just be SOL on shrinking this down if I can’t get those menus to work.

Thanks for all your help.

Regards,

Justin

[Swift Ideas – Ed]

The main issue was the margin left on the logo on mobile sizes, and the margin left on that menu item as far as I could see.

Checking the demo site naked header page here, and all is working 100%. Can you provide any screenshots?

– Ed

[rblackfox]

Hmmm, well thanks for all your help Ed, Appreciated!

JR

[Swift Ideas – Ed]

Glad I could help, hopefully you sort your css. If you want to keep those changes for desktop just use the media queries to correct it on mobile.

– Ed

[Blue Max]

Ha, hi there again!

Ed, thanks for the link towards making a text based menu for the Android bug. I’ll work this out 🙂

for 4), I’ve fixed 4 by changing the values to the default ones. value 0 made them go wild but I’ve specified them now, so that’s cool.

for 3), the animation is amazing, it’s more that it doesn’t work too proper on the iPad here. When you click them, they open up like you say, but they also tend to glitch when you press them again while in the animation, which is expected because of the small delay before the animation starts.

Also, on iPad, it doesn’t change to landscape mode, it stays in desktop/laptop function, which hurts the menu options.

Love the help so far!

Ruben

[Swift Ideas – Ed]

3) Can you let me know what you mean by “it won’t change to landscape mode”? Working on doing what we can to make the animated icon boxes as clean as possible on iPad!

4) Glad you sorted it.

– Ed

[Blue Max]

Hey Ed,

Happy to hear you’re working on them! For the iPad, when turning it sideways, and the screen switches to landscape, the http://www.blue-max.nl website changes from iPad responsive, to desktop/laptop responsive.

For example, the menu buttons are the the regular website ones. So if you want to tap one that has a submenu, it opens the submenu, but then loads the original page immediately. When we turn the iPad to portrait, it does show an iPad friendly menu, which we all know and love.

Hope you understand and can help!

many thanks

[Swift Ideas – Ed]

We’re going to do our best to change it so that the mobile header version shows on tablet landscape as well for the next update.

Thanks,

– Ed