Graphical Glitch in drop-down menu on iPad

Elegant Joomla template designed especially for both professional and personal website presentation.
GK User
Sat Nov 06, 2010 12:51 am
Hi,

I've found a graphical glitch in the drop-down menus on the iPad. This doesn't affect Safari on the desktop, just Mobile Safari on the iPad:

If you look at the demo for postnote on Gavick's demo website, open the "Template" menu and you'll see a feint line underneath the "Module variations" entry, above the separator for the next entry. This line is very feint on the light theme and not noticeable on dark theme, but when I colorised the graphic on my website, this line became much more prominent. This line doesn't appear on desktop Safari, but does on Mobile Safari on the iPad.

I've tracked this feint line down images/style1/submenu_bg.jpg. The color of the very last row of this graphic (ie. #7a7a7a) is generating this graphical glitch. If I change this last row to match the color of the very top row of this graphic (ie. #555555), the line disappears on Mobile Safari on the iPad. While the very last row of the corresponding graphic in style 2 doesn't match the very top row of the graphic, the colours are so similar, I can't discern the line on the iPad.

submenu_bg.jpg should be fixed in the template (for both styles) to fix this graphical glitch on the iPad.

Kind regards,
Dave.
User avatar
Senior Boarder

teitbite
Sun Nov 07, 2010 8:16 pm
Hi

Could You please attache a screen of this problem ?
User avatar
Moderator

GK User
Sat Nov 13, 2010 10:18 pm
Hi,

I figured out how to take a screenshot from the iPad. This issue only happens in Mobile Safari on the iPad and not on Desktop Safari. Pay close attention to the "Template menu", the area between the text of the second item "Module variations" and the separator between the second and third items: there is lighter grey 1 pixel high stripe that doesn't appear on desktop browsers. This problem was much more pronounced when I changed the colour of the graphic (using the "Colorize" feature in Photoshop). As indicated in my first post, modifying the last row of the graphic "images/style1/submenu_bg.jpg" fixes the problem.

Kind regards,
Dave.
User avatar
Senior Boarder

teitbite
Mon Nov 15, 2010 3:20 pm
Hi

So is this problem solved ?

To be honest I see no diffrence in menu on this two images ;/
User avatar
Moderator

GK User
Wed Nov 17, 2010 9:41 pm
Hi,

It's pretty hard to see with the screen shot - the iPad will only take a compressed jpeg screen shot that distorts the graphical glitch (I also think it's hard to see from the screen shot) and it's difficult to photograph the problem. It's easiest seeing this in real life with an actual device.

The solution to modify the graphic as described in my first post hides this graphical glitch and is a solution to the problem. If it's not going to be changed in the template, users can make this change themselves using the instructions I detailed.

Kind regards,
Dave.
User avatar
Senior Boarder

teitbite
Sun Nov 21, 2010 1:25 am
Hi

I got to buy iPad :)
User avatar
Moderator

GK User
Mon Nov 22, 2010 12:38 am
You can call it a business expense - purely for business purposes of course, right? :)
User avatar
Senior Boarder

teitbite
Mon Nov 22, 2010 11:41 pm
Hi

Right :) Just the same as PSP3. You can watch internet on it, right? :D
User avatar
Moderator

GK User
Tue Jun 14, 2011 3:27 am
dajvid wrote:Hi,

I've found a graphical glitch in the drop-down menus on the iPad. This doesn't affect Safari on the desktop, just Mobile Safari on the iPad:

If you look at the demo for postnote on Gavick's demo website, open the "Template" menu and you'll see a feint line underneath the "Module variations" entry, above the separator for the next entry. This line is very feint on the light theme and not noticeable on dark theme, but when I colorised the graphic on my website, this line became much more prominent. This line doesn't appear on desktop Safari, but does on Mobile Safari on the iPad.

I've tracked this feint line down
ipad2 keyboard cases images/style1/submenu_bg.jpg. The color of the very last row of this graphic (ie. #7a7a7a) is generating this graphical glitch. If I change this last row to match the color of the very top row of this graphic (ie. #555555), the line disappears on Mobile Safari on the iPad. While the very last row of the corresponding graphic in style 2ipad 2 keyboard dockdoesn't match the very top row of the graphic, the colours are so similar, I can't discern the line on the iPad.

submenu_bg.jpg should be fixed in the template (for both styles) to fix this graphical glitch on the iPad.ipad2 stand

Kind regards,
Dave.

You can watch internet on it, right?
User avatar
Fresh Boarder


cron