css3 webfont

  • Wenchieh YEN

    Wenchieh YEN - 2008-08-26

    Hi Davide,

    I came across your excellent jsMath by trying to put some math into my web presentation. Thank you for this great framework!

    Safari (3.1) has support for css webfont (http://www.w3.org/TR/css3-webfonts/) and the Firefox support is under way (due 3.1 release). This opens up the possibility of having a supplement to the "image fonts" and unicode fallback for jsMath. Are you planning on integrating this in the next release of jsMath?

    - wen

    • Wenchieh YEN

      Wenchieh YEN - 2008-08-26

      I should have elaborated a little more on this topic. What I meant was

      @font-face {
        font-family: jsMath-cmr10;
        src: url("somewhere/jsMath-cmr10.ttf)

      So that user can use the cmr10 instead of having the image fallback.

      - wen

    • Davide P. Cervone

      Thanks for the information and pointers.  In the past, I have avoided functionality that could not be duplicated across all the browsers where jsMath is used.  But it does seem that this is useful enough to use it when it is available.  I will look into it further.

      Thanks again for the suggestion.


  • Włodek Bzyl

    Włodek Bzyl - 2009-10-13

    @font-face works with the Firefox 3.5.

    I put an example here:


    To make it work I have to fool jsMath that TeX fonts are installed.
    My solution was to install jsMath-cmex10.

    My question is: is there straightforward way of disabling jsMath
    font checking?


    -Włodek Bzyl

  • Davide P. Cervone

    You are right that Forefox 3.5 supports @font-face (as does Safari3, Opera10, and Internet Explorer, though in a completely different way from the others).

    But making jsMath work with @font-face is not a trivial change, and not one that you will be able to make yourself.  One of the problems is that some browsers initially lay out the page with a default font and then change it once the true font has been loaded; this will not work with jsMath, since it measures the sizes of things as it constructs them, so if the sizes change later, things like fractions and square roots and so on will not be properly typeset.  One would need to wait for the fonts to be fully downloaded before typesetting any of the math.

    Another problem would be that only the very latest browsers would be able to handle your pages.  If you are making pages for private use, that is fine, but for public pages, this would make your mathematics unreadable by many people.

    Furthermore, since IE uses a completely different approach to @font-face from everyone else, you would need to provide fonts in a different format for IE users, and they are not easy to create in the proper form.

    In conclusion, this is not an easy change, and not one that you are likely to get to work properly without a lot of work. 

    You can disable the font check by setting the certain cookie values.  Add the following to your easy/load.js file just before the "do not modify below this" comment:

        jsMath.Font = {Check: function () {}};

    but this is a really bad idea.


  • Włodek Bzyl

    Włodek Bzyl - 2009-10-20

    \> If you are making pages for private use, that is fine,

    I'm going to write several pages for my students.
    They use the latest Firefox. Usually, most of them have problems with
    installing TeX fonts on their computers and it takes some time
    to get through installation procedure.

    Thanks for your answer.


  • Davide P. Cervone

    The image fallback mode should work fine for this situation.  The students don't HAVE to install the fonts (and you can remove the warning message if you feel that is necessary).  If you haven't installed the image fonts, you should do that, as it is specifically for this purpose.


  • Davide P. Cervone

    I checked the address you gave above, and it looks like you DON'T have the image fonts installed.  That is an important piece of jsMath, so you should do that before trying to modify jsMath to use @font-face and see if that is sufficient for your needs.

    See the (http://www.math.union.edu/~dpvc/jsMath/authors/installation.html) for details about the image fonts.



Log in to post a comment.