MathJax and Zoom problem on mobile device
150 views
Skip to first unread message
Stephan Claus
Feb 29, 2012, 10:12:49 AM2/29/12
to mathja...@googlegroups.com
Hello,
I ran into a strange error - I was testing my MathJax rendered content on an ipad with meta tag
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=5.0; user-scalable=1;" />
and I have the problem that I can not zoom (put two fingers on the screen and expand) when both fingers are on MathJax rendered content. It works when one finger is on a non rendered area.
I tried this on mathjax.org as well, same problem here.
I modified my config to be very restrict, taking out the mathmenu, the zoom, only using systemfonts and everything that would put an event on the content, but with no sucess. (I attached my configuration)
What could be the problem here? (or even better: the solution :))
I thought about the following:
-problems with position:relative;
- problem for the webkit browser because mathjax is rendered after the page is loaded
- are there hidden events you can not control over the config file.
It would be great if someone has some suggestions to look at and possible bugfixes.
You can test the behavior on www.mathjax.org
Best regards
stephan c.
I ran into a strange error - I was testing my MathJax rendered content on an ipad with meta tag
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=5.0; user-scalable=1;" />
and I have the problem that I can not zoom (put two fingers on the screen and expand) when both fingers are on MathJax rendered content. It works when one finger is on a non rendered area.
I tried this on mathjax.org as well, same problem here.
I modified my config to be very restrict, taking out the mathmenu, the zoom, only using systemfonts and everything that would put an event on the content, but with no sucess. (I attached my configuration)
What could be the problem here? (or even better: the solution :))
I thought about the following:
-problems with position:relative;
- problem for the webkit browser because mathjax is rendered after the page is loaded
- are there hidden events you can not control over the config file.
It would be great if someone has some suggestions to look at and possible bugfixes.
You can test the behavior on www.mathjax.org
Best regards
stephan c.
Thomas Leathrum
Mar 1, 2012, 10:49:50 AM3/1/12
to mathja...@googlegroups.com
I don't have an iPad, but on my Android tablet and on my iPod Touch, pinch gestures perform as expected with MathJax 2.0, even with both fingers on a MathJax expression, no problem with zooming. Keep in mind that with MathJax 2.0, a two-finger touch-and-hold event brings up the MathJax contextual menu -- Touch events have been reworked for version 2.0. At any rate, on the platforms I have available, I'm not seeing the issue you describe. Can anyone else out there reproduce this?
Davide P. Cervone
Mar 1, 2012, 11:14:59 AM3/1/12
to mathja...@googlegroups.com
I am able to reproduce the issue. MathJax's "double-tap-and-hold" is implemented by checking for a double-tap (two successive taps in close succession) where the second is held down. I suspect that the pinch is coming as two separate tap events in close succession, and since you hold to pinch or stretch, it is triggering MathJax's menu code.
I will check into it further and see about a work-around. For now, you can disable the double-tap checking by using
<script type="text/x-mathjax-config">
MathJax.Hub.Register.StartupHook("MathEvents Ready",function () {
MathJax.Extension.MenuEvents.Touch.delay = -1;
});
</script>
This is prevent MathJax from trapping the double-taps and should make pinching work properly again.
Davide
Stephan Claus
Mar 1, 2012, 2:29:42 PM3/1/12
to mathja...@googlegroups.com
Hello Davide,
where do I have to put this configuration? My code looks like this:
<head>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=5.0; user-scalable=1;" />
<script type="text/javascript" src="js/jquery-1.7.min.js"></script>
<script type="text/javascript" src="mathjax/MathJax.js?config=default"></script>
<script type="text/javascript" src="js/custom.js"></script>
....
and I start rendering MathJax Content in the custom.js with:
MathJax.Hub.Queue(["Typeset",MathJax.Hub,"ElementID"]);
I tried to put your snippet before the loading of mathjax and behind, but the loading of MathMenu.js and Zoom.js took endless and after that I could a MathJax error that it could not render.
Do I miss something?
And next question: Is it possible to "permit" MathJax to load files like MathMenu.js, Zoom, Mathevent etc. if it is not needed?
Or would this just increase my problems? :)
Thanks for your support
stephan c.
where do I have to put this configuration? My code looks like this:
<head>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=5.0; user-scalable=1;" />
<script type="text/javascript" src="mathjax/MathJax.js?config=default"></script>
<script type="text/javascript" src="js/custom.js"></script>
....
and I start rendering MathJax Content in the custom.js with:
MathJax.Hub.Queue(["Typeset",MathJax.Hub,"ElementID"]);
I tried to put your snippet before the loading of mathjax and behind, but the loading of MathMenu.js and Zoom.js took endless and after that I could a MathJax error that it could not render.
Do I miss something?
And next question: Is it possible to "permit" MathJax to load files like MathMenu.js, Zoom, Mathevent etc. if it is not needed?
Or would this just increase my problems? :)
Thanks for your support
stephan c.
Davide P. Cervone
Mar 1, 2012, 2:55:58 PM3/1/12
to mathja...@googlegroups.com
My error. It should have been MathEvents not MenuEvents:
MathJax.Hub.Register.StartupHook("MathEvents Ready",function () {
MathJax.Extension.MathEvents.Touch.delay = -1;
});
Davide
Reply all
Reply to author
Forward
0 new messages