Hi

I have a small issue with the image scaling on my menu items. The problem is that I need the image to have 100% width of the menu button. And that doesn't work when I view the site in "wide format" on my iPhone (horizontally). 

In fact I would like to use a large image that would cover the button in wide format, and then hide some of the image in normal vertical display (narrow / normal format), but can't seem to get that working. 

I'm pretty sure this border case is not supported by Mobile Joomla, but would it be possible to do?
Even just to turn off image scaling for menu items, and keep it for regular content?

Thanks
Daniel

You can try to apply css style like


Actually, in this case images will be blurred in lanscape mode because of rescaling.

Hi

Thank your for your fast reply, but I don't think that will do it. 
Looking at the source code, the menu image is scaled and added width attributes to it. 



The original image I'm testing with is currently 879px wide

Yes, but then we stretch image to have ~450px width (and autorescale height).

Unfortunately, currently we haven't implemented a way to process such a situations (moreover, server doesn't know orientation of your device to rescale images correspondingly).

In the theme css file that I'm modifying I found this:

body.landscape .toolbar>h1

So I'm guessing here, that jqtouch support a way to detect landscape mode, but it's not implemented in mobilejoomla. 
A stretched 300px scaled image to 100% in landscape on my iPhone looks pretty bad - very pixelated. It's a solution, but far from perfect.

Hi. 
Would you please let me know if anyone solved this problem?
I have the same problem with my image size when I changing the mobile orientation from horizontal to vertical.

Or at least, is there any way to lock the orientation?
Can you tell me how you re sized menu items (coding line)?
Regards,
Al

Well, I spent more than two days to find the best, easiest and right solution on mobile orientation issue.
Here is the answer:
- Go to FTP and locate the mobile_iphone template folder.
- Download index.php into your local system
- Remove line 32: <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no">
-Insert :<meta name="viewport" content="user-scalable=no,width=device-width" /> instead of the previous meta tag.

Then you are done. when you rotate your mobile to landscape mode then you have full size image and text align to center on landscape mode.

Note: remember to set Adaptation mode from iphone backend setting to "Don't re scale" and your image width size should be 320px .

Regards,
Al