Mootools; Click Event; Ipad; Some work and Some don't - ipad

http://jsfiddle.net/styks1987/jnFKC/3/
When using the Ipad some of my 'clickable' elements work and some do not.
The code that I have provided works on desktop safari and firefox. When I try to click/touch these with the ipad, I get nothing.
Your help is greatly appreciated. This is an excerpt from a larger project. Other elements on the same page work fine with the Ipad.
thanks,

Related

Why are the background images not showing on iphones and ipads?

I have been trying to troubleshoot this page for what feels like eons. theafropick.co.uk is the site. Everything seems to work fine on all devices except on ipads and iphones the section with 6 tiles is completely gone.
It looks like it's just Safari that is having the issue. Here's a thread that shows other people having the issue:
Background image not showing in Safari
That thread has many different solutions, and I tried many within the inline safari dev tools without any luck. If they don't work for you either I would try using jpg instead of png.

ScreenRotation on iPad

I want my APP on iPad that A-View is Portrait-only and B-View is Landscape(Left or Right)-only.
I tried [application:supportedInterfaceOrientationsForWindow:] in my AppDelegate.m and [shouldAutorotate:][supportedInterfaceOrientations:][preferredInterfaceOrientationForPresentation:]in my NavigationController,ViewController which I used to show my APP(iOS 11).
It works well on iPhone, but when I try on iPad it doesn't work even [application:supportedInterfaceOrientationsForWindow:].
I want know how to control ScreenRotation on iPad.
Thank you very much.
Appreciate for your kindness help.
solved, just keep for reminder
iPad has the multipleScreen Function that it must support All-Rotation.
But when you check [Requires full screen]on Deployment Info, it means iPad now is full screen and the Rotation Function can work well.

Menu Link on Joomla Site not working on iPhone 6 Plus

I am trying to workout why my menu on my Joomla website does not work properly specifically on an iPhone 6 Plus in landscape mode. I have tested this on my computer with the same viewport and I have no issues but I have been told a few times by friends/colleagues of this issue and I am kind of struggling to workout why this is happening and how i can fix it.
If somebody could please advise on any other methods that I could try to help fix this as unfortunately I don't have an iPhone 6 Plus to actually see this issue.
The site can be viewed at http://www.leicesterbakery.co.uk
I can confirm that for me the mobile menu wasn't working on an iPhone 6 Plus either.
When I clicked on the menu icon it was like focussing on the search box.
I think I have the solution.
In your CSS file at http://www.leicesterbakery.co.uk/templates/lbakery/css/custom.css, go to line 1018 and edit the width of the .search class from 80% to something lower.
In my tests, the following worked well.
.search {
width:70%;
float:left;
margin-top:20px;
}
After making the above change the mobile menu worked for me on an iPhone.
Good luck!

Webapp not displaying properly on ipad air

Im having a problem with a webapp I have developed. I would really appreciate your help and guidance with this issue.
My app has been developed at 1024px x 768px and it is working fine on the ipad 4th gen. Please note that this app is made for landscape mode only.
When the app is viewed on ipad air it seems to disappear slightly off the screen bottom and right. I have checked the resolutions and they seem to be both the same.
Does anyone know why this is caused?
Thank you in advance!
I have finally managed to find an answer! - This problem was oocuring due to now devlaring the viewport in the meta tag header! Once decalred the problem sorted!

extjs apps on iphone

This is an extjs single-page application which works fine in FF, IE, and Safari.
There are several problems with viewing or using this extjs app in the iphone. The extjs panels/windows do not resize, as it would in a normal screen. When the user zooms out, the expanding viewing area is blanked out. An example image is below:
Iphone does not recognize the combo box of the extjs.
Unable to scroll down.
Viewport Issue:
The main issue is with the viewport. It does not scroll or zoom properly in Iphone.
Ext JS is not (and will likely not be) optimized for mobile devices. That's the purpose for Sencha Touch, which is the mobile framework built on Ext JS and specifically intended for iPhone and Android. I doubt you're going to have much luck resolving these types of issues using standard Ext JS.
We have experienced the same kind of problem with ExtJS and iPhones, and a slightly different, yet comparable, problem with android devices. I guess that those browsers report the screen size in a way that confuses ExtJS, so the layout mechanisms do not work. Since Sencha Touch has a similar API like ExtJS, making a Sencha Touch version of your software is probably the smartest way to make it work properly on iDevices and Androids.
Rather than using viewport, I used a column layout panel container. Most of the extjs stuff works fine. I placed this container layout into a div and specified its height and width. Also, <meta name="viewport" content="height=700" />.

Resources