I would like to know, how can I get pageinit event without jquery mobile or with minimal assembly/build of jquery mobile library at which event will work?
I need to use $(document).ready(function() on mobile devices, but only this functionality, nothing else.
Related
I'm working on a wordpress site, and I'm trying to get touch events to work, I'm currently using a simple touch start event like this:
$(".element").bind("touchstart", function() { $(".element").hide(); });
Where element is just a button tag.
My problem is that the events are not firing on any browser for IOS, even though they are working correctly on android.
I'm lead to believe that wordpress might have something to do with this, because I've tried the same events on web pages without wordpress, and they all work fine.
I'm using JQuery Mobile for recognizing swipe events and it works well. Events fire on Windows Mobile (7.5 in my case), but what also fires is the web browser's default events for navigating the browsing history. Swiping right turns back a page. How can I prevent this default behavior?
I tried the preventDefault() and it didn't help here.
It will deactivate the touch:-
Add CSS snippets:
*{
touch-action: none;
}
But to reactivate the touch event only on the some zone, to allow the player to play or active the touch
To activate for certain places add this :-
#activetouch{
touch-action: chained;
}
Reference:https://developer.mozilla.org/en-US/docs/Web/CSS/touch-action
Windows Phone 7/IE9 does not support mousemove event so there is not way for jquery mobile to recognize swipe event.
Some mobile frameworks like Apache Cordova (PhoneGap) provide workaround for this by adding special shim between native (silverlight) touch events and web browser control to fix missing mouse events. Demo
This works fine on Windows Phone 8 since it supports mousemove.
I use jquery .on delegates to perform events when an item is clicked and in the desktop browser of the site it works. However on viewing a mobile browser such as Chrome they only work on A tags with a href filled in (usually "#"). Div tags can't be tapped in the mobile version.
$("body").on("click", ".nav", function () {}); //etc
I really don't understand why mobile browsers don't recognize these actions as tapable.
i have a question regarding jQuery mousemove() on iPhone. The problem is that it doesn't show the movement on iPhone when touches occur; the events are not working properly in Safari on iPhone.
Can I get any tips of any Javascript plugins to fix this or detect movement on iPhone?
You can use jQuery mobile and use the virtual events created by that plugin (vmousemove for example). More info on the events here.
However this framework is NOT compatible with every jQuery plug-in (for example some of jQuery-UI widgets are integrated in it, but in a different way). It probably works for plugin that are not event driven (i.e. that don't change the way the user interract).
An other choice is jQTouch but I don't know much about it.
You should use the touchmove event. Example of usage:
$('#selector').bind('touchmove', function(event)
{
// your code...
});
I have a page that uses JQuery UI; in particular the Sortable interaction.
The page works fine for desktop web browsers with mice, however I can't get the drag-drop functionality to work on Mobile Safari on the iPhone. Any dragging action simply scrolls the page.
The functionality on my page is extremely similar to the Sortable Empty-Lists demo on the JQuery UI site. This page also doesn't work on the iPhone.
Is there any way to get the drag-drop functions working on the iPhone?
According to the Mobile Safari docs drag and drop is not supported, but it can be simulated. Since basically dragging your finger along will scroll the browser you will have to disable this. That can be done like this:
$(document).bind('touchmove', function(e) {
e.preventDefault();
}, false);
Otherwise the event you will have to handle are touchstart, touchmove and touchend.
This is a demo of jquery ui 1.9pre:
https://dl.dropbox.com/u/3872624/lab/touch/index.html
The jquery.mouse.ui.js file is working great for me.