Likno Blog – Drop-Down Menus, Javascript Menus, CSS Menus, jQuery Scrollers/Sliders, Modal Windows and more...

Knowledge Base support case for AllWebMenus, abstracted and stripped of all user’s private info.

Initial Email From: Harvey
Initial Email Subject:  Menu displaying on ipad
Support Case Month: March 2012

I created a menu (AllWebMenus ver 5.3) that displays on a PC fine in ie9 and mozilla etc. but on an Ipad II in safari and on an iphone 4s the menu extends over the right side of the body of the site.

Related URL: http://www.icrsd.net

Reply From: Likno Customer Support

Hello,

I noticed that while your compiled menu file (menu.js) is from build 886, the online library files (“awmdata” folder) are from an older build (876).

This may be causing some issues. Could you please make sure that you uploaded the new library files (“awmdata” folder) and let me know?

Regards,
Kostas
Likno Customer Support
www.likno.com
Create any type of javascript menu (CSS menu, drop-down menu, sliding menu), button, html tree, modal window, tooltip, accordion, tab, scroller, jQuery slider or design for your websites!
Like us on Facebook – Follow us on Twitter

Reply From: Harvey

I copied over the awmdata folder but that did not fix the issue.

Reply From: Likno Customer Support

Dear Harvey,

Would it be possible to send me a screenshot of the problem?

Also, before doing this, please try to delete the cache files from your iPad and iPhone, and refresh the page again.

Regards,
Kostas
Likno Customer Support
www.likno.com
Create any type of javascript menu (CSS menu, drop-down menu, sliding menu), button, html tree, modal window, tooltip, accordion, tab, scroller, jQuery slider or design for your websites!
Like us on Facebook – Follow us on Twitter

Reply From: Harvey

I cleared the cache but still this result (see attachment)

Reply From: Likno Customer Support

Dear Harvey,

I noticed that the menu item letters in the screenshot you sent me are a bit different than what I see in my browser.

Is it possible that your iPad does not support the specific fonts you are using (Segoe UI, Tahoma, Verdana)? Can you remove “Segoe UI”? Tahoma and Verdana should be supported, so it should be “Segoe  UI” that is causing this. Also, you may want to reduce the item padding so that the menu is smaller than the width you want it to cover, then give the menu a minimum width of 800 to make it expand as required:

Regards,
Kostas
Likno Customer Support
www.likno.com
Create any type of javascript menu (CSS menu, drop-down menu, sliding menu), button, html tree, modal window, tooltip, accordion, tab, scroller, jQuery slider or design for your websites!
Like us on Facebook – Follow us on Twitter

Reply From: Harvey

Kostas

I am experiencing another issue.  I have created a new menu in a new site the url is www.materialthingsinc.com

The menu look fine in IE9 and Mozilla Firefox and even Google Chrome but on an ipad  (Safari) the font is different and the positioning is not centered.

Wonder what causes this issue?

Regards

Harvey

Reply From: Likno Customer Support

Dear Harvey,

Different browsers may show some fonts (especially the fancy ones) differently, sometimes even changing their size. This is due to the way each browser renders the font, and also depends on which font-related features you have enabled (such as the “cleantype” or anti-alias features that some browsers have to present the fonts in a more readable manner).

This however is not related to the menu and the same issue will present with simple in-page text using the same font. I am afraid that there is nothing we can do on our side regarding this. The only 100% safe solution to make sure that the fonts look identical to the pixel is to use images instead.

Still, you could change your menu Positioning to accommodate for this font change. I see that you have positioned your menu “Relative to Element” using the id “masthead”. However (If I am not mistaken) you are using the X offset to horizontally center the menu. Did you try using something like the following?

Regards,
Kostas
Likno Customer Support
www.likno.com
Create any type of javascript menu (CSS menu, drop-down menu, sliding menu), button, html tree, modal window, tooltip, accordion, tab, scroller, jQuery slider or design for your websites!
Like us on Facebook – Follow us on Twitter

Reply From: Harvey

Menu now is positioned correctly on all browsers.

Thanks

Harvey