MathJax zoom on displayed math about pretext HOT 15 CLOSED

Dear Chris,

Great to hear from you, and thanks for the report.

In Firefox, I right-click on MathJax, then Math Settings > Zoom Trigger and see
"None" checked. So I am surprised your screenshot even shows part of a zoom. ;-)

I just set the following temporarily in the configuration and I get a similar
partial box you see.

menuSettings: {
zoom: "Double-Click",
},

If a MathJax display is too wide, we put a horizontal scrollbar on it. I wonder
if there is some interaction from that feature which is preventing the pop-up'ed
zoom'ed display from being fully visible (even if not too wide)? I'll
investigate more and report here.

Thanks again,
Rob

On 05/08/2014 08:03 PM, cmhughes wrote:

Hi Rob,
This is a great project! We met last year (June 2013) in Vancouver at the
WeBWorK coding camp.

I've been playing with the mathbook, and it works very nicely. I have noticed
that when viewing the html version, if I enable Zoom factor for MathJax, then
the displayed math mode gets cut off when zoomed in. I'm using the
|sample-article.xml|; I've posted a screenshot here:

http://spot.pcc.edu/~chughes/nozoom.png http://spot.pcc.edu/%7Echughes/nozoom.png

I wonder if you have any insight on this?
Chris

—
Reply to this email directly or view it on GitHub
#5.

from pretext.

Hi Rob,
Thanks for the follow-up.

After some digging, I believe the issue is with the following lines from http://aimath.org/mathbook/mathbook-modern-3.css

.MathJax_Display {
  /* Allow mobile users to scroll equations 
  * horizontally when they don't fit on the screen 
  */
  overflow-x: auto;
  overflow-y: hidden;
  padding-top: 1px;
  padding-bottom: 1px;
 }

If they are cut/commented, then equations are allowed to zoom.

According to the comments surrounding this part of the css it allows mobile users to scroll when the equation doesn't fit. It would be great if we could somehow have the best of both worlds - I guess we need to find a complete list of options :)

Chris

from pretext.

Dear Chris,

Yes, that's it. Michael DuBois (one of my students) has done some great work
with the CSS/Javascript and he just sent me the same pointer:

https://github.com/mxdubois/fcla-styles/blob/develop/scss/src/_mathbook.scss#L102

As an author, I really like

(a) a fixed width on a rendered page, it helps readability

(b) letting math go "too wide" and then getting a horizontal scrollbar

But I would also like to support accessibility, so getting this to work
long-term would be great.

We should have Michael's services this summer, so I will put this on his list.
;-) But it could be a suggestion for the MathJax folks as well, to allow the
horizontal scolling and have the zoom pop-up over the whole page (rather than
just the div).

Thanks again for pointing this out.

Rob

On 05/09/2014 12:47 PM, cmhughes wrote:

Hi Rob,
Thanks for the follow-up.

After some digging, I believe the issue is with the following lines from
http://aimath.org/mathbook/mathbook-modern-3.css

/\* Allow mobile users to scroll equations
- \* horizontally when they don't fit on the screen
- */ overflow-x: auto; overflow-y: hidden; padding-top: 1px; padding-bottom:
  1px; }```

If they are cut/commented, then equations are allowed to zoom.

According to the comments surrounding this part of the |css| it allows mobile
users to scroll when the equation doesn't fit. It would be great if we could
somehow have the best of both worlds - I guess we need to find a complete list
of options :)

Chris

—
Reply to this email directly or view it on GitHub
https://github.com/rbeezer/mathbook/issues/5#issuecomment-42706187.

from pretext.

But it could be a suggestion for the MathJax folks as well, to allow the horizontal scolling and have the zoom pop-up over the whole page (rather than just the div).

See the discussion around mathjax/MathJax#749 (comment)

from pretext.

Dear Peter,

Thank-you very much for the pointer. I's complicated, I see. ;-)

Your comments there make me wonder if stuffing the zoomed content into a knowl
(with a horizontal scrollbar) is a practical/feasible way to do this while we
keep a hard limit on the width of the main content (for readability, we prevent
lines from being overly wide). We'd have to manufacture a place to click to
collapse the knowl, I guess. I don't think we do anything specialized with the
CSS on the math content per se, so the content in a knowl should get the same
(global) treatment. I think.

While an author should try to break lines of displayed mathematics sensibly, I'd
love to keep the scrollbar available for the cases where it does not fit
horizontally. For example, I generally do not number equations, but in some of
David Farmer's conversions he has lots of numbered equations and this adds to
the overall width.

Thanks again for pointing us in the right direction.

Rob

On 05/09/2014 02:01 PM, Peter Krautzberger wrote:

But it could be a suggestion for the MathJax folks as well, to allow the
horizontal scolling and have the zoom pop-up over the whole page (rather
than just the div).

See the discussion around mathjax/MathJax#749 (comment)
mathjax/MathJax#749 (comment)

—
Reply to this email directly or view it on GitHub
#5 (comment).

from pretext.

It's been a while since this thread had discussion. Here is the behavior I see now. I'm wondering if this is still an issue or if this can be closed. Chris's original example is gone now, so I can't compare exactly to what I see.

I am looking at a large multiline equation that almost fills the central panel.

If my screen is very wide, there is no need for scrolling. If I trigger the MathJax zoom, then it zooms fully and there is no cropping or need for scrolling.

If I narrow my screen some, to the point where the un-zoomed content is still fully visible, but now the zoom box doesn't fit, then in the zoom box, I get a horizontal scroll bar. The zoom box is still tall enough for all of the rows.

If I narrow my screen to the point where the un-zoomed content requires a horizontal scrollbar, then the zoom box is shorter than its content and has both horizontal and vertical scrolling. The vertically cutoff and scrolling seems unnecessary. Is this the only thing that is less than ideal at this point?

from pretext.

Does seem to have improved greatly. But try this:

Single-line displayed equation inside a knowl. Zoom factor 200%. Browser width
just wide enough to contain ToC sidebar and all of the knowl.

Double-click to zoom and just get the top edge of the zoom box visible in the
region containing the equation. Can't see any math in the zoom-box. Widen the
browser window in discrete baby steps and quickly (not immediately) the box
becomes visible (same location) with a horizontal scrollbar.

On 09/07/2015 04:29 PM, Alex Jordan wrote:

It's been a while since this thread had discussion. Here is the behavior I see
now. I'm wondering if this is still an issue or if this can be closed. Chris's
original example is gone now, so I can't compare exactly to what I see.

I am looking at a large multiline equation that almost fills the central panel.

If my screen is very wide, there is no need for scrolling. If I trigger the
MathJax zoom, then it zooms fully and there is no cropping or need for scrolling.

If I narrow my screen some, to the point where the un-zoomed content is still
fully visible, but now the zoom box doesn't fit, then in the zoom box, I get a
horizontal scroll bar. The zoom box is still tall enough for all of the rows.

If I narrow my screen to the point where the un-zoomed content requires a
horizontal scrollbar, then the zoom box is shorter than its content and has both
horizontal and vertical scrolling. The vertically cutoff and scrolling seems
unnecessary. Is this the only thing that is less than ideal at this point?

—
Reply to this email directly or view it on GitHub
#5 (comment).

from pretext.

I see the same issue. Firebug tells me the zoom box I'm looking is:
<span id="MathJax_Zoom" style="font-size: 200%; max-width: 363px; max-height: 4px; left: -432px; top: -17px;">

And if I directly change that max-height: 4px; to something larger, or even better just delete it, then I see full height. Likewise I can increase max-width to get something more reasonable.

But the point is, MathJax is in control here. These are inline CSS attributes within the actual zoom box. MBX's CSS can't overrule them. Maybe MathJax can be configured to help though.

from pretext.

Do you read the [mathjax-users] group?

I have a good live example (in AATA) though not minimal. I don't mind posting
to ask, but would perhaps need help with the technical discussion that would ensue.

It seems like we are close to having this work well, and they might be
interested in the scenario?

Rob

On 09/07/2015 05:50 PM, Alex Jordan wrote:

I see the same issue. Firebug tells me the zoom box I'm looking is:
||

And if I directly change that |max-height: 4px;| to something larger, or even
better just delete it, then I see full height. Likewise I can increase
|max-width| to get something more reasonable.

But the point is, MathJax is in control here. These are inline CSS attributes
within the actual zoom box. MBX's CSS can't overrule them. Maybe MathJax can be
configured to help though.

—
Reply to this email directly or view it on GitHub
#5 (comment).

from pretext.

I don't receive updates, but it's in my list of "recently viewed". I could add it to my rounds of checking mathbook and ww-mbx. (I don't get updates on these either. For whatever reason I prefer to just drop in and catch up.)

Might be good to (at least try to) rule out a MathJax config solution first. I'll post here if I do that.

from pretext.

I read that newsgroup. It will be much appreciated if your posting, when
you are ready to do it, contains a link to a live example.

The discussions on MathJax/javascript/etc are usually over my head,
but Davide Cervone is great and is likely to post a useful reply.

On Mon, 7 Sep 2015, Alex Jordan wrote:

I don't receive updates, but it's in my list of "recently viewed". I could add it to my rounds of
checking mathbook and ww-mbx. (I don't get updates on these either. For whatever reason I prefer to
just drop in and catch up.)

Might be good to (at least try to) rule out a MathJax config solution first. I'll post here if I do
that.

—
Reply to this email directly or view it on
GitHub.[AAM6LDVQN40Gz_uDd8AtMYYhgYdxDOvrks5ovi8HgaJpZM4B5XLy.gif]

from pretext.

I posted a question: https://groups.google.com/forum/#!topic/mathjax-users/lDSG0OQWPzk

from pretext.

I just saw it, and will watch.

On 09/07/2015 09:35 PM, Alex Jordan wrote:

I posted a question:
https://groups.google.com/forum/#!topic/mathjax-users/lDSG0OQWPzk

—
Reply to this email directly or view it on GitHub
#5 (comment).

from pretext.

David F just did some CSS edits that appear to address this. We checked in Firefox, Chrome, Safari.

from pretext.

Thanks!

from pretext.