mozilla
Your Search Results

    MathML Demo: <mspace> - space Redirect 1

    MathML Demo: <mspace> - space

    The background color of <mspace> elements has been set to yellow for easier viewing. You can set the width x y height x y and depth [ x y ] of mspace elements (click the math text to view the numeric values that are set).

    Interactive Sizing

    HTML Content

    <p>
    Use the control buttons below to adjust the parameters of
    the <code>mspace</code> element and see the effects. <br />
    Height
    <a class="control" href="javascript:upheight();" title="increase height">+</a>/
    <a class="control" href="javascript:downheight();" title="decrease height">-</a>
    Width
    <a class="control" href="javascript:upwidth();" title="increase width">+</a>/
    <a class="control" href="javascript:downwidth();" title="decrease width">-</a>
    Depth
    <a class="control" href="javascript:updepth();" title="increase depth">+</a>/
    <a class="control" href="javascript:downdepth();" title="decrease depth">-</a>
    
      <math display="block">
    <mstyle displaystyle="true">
    <msqrt>
    <mrow>
    <mn>3</mn>
    <mspace style="background-color: yellow" id="thespace" height="0.1ex" depth="0.1ex" width="0.1em" />
    <mi>x</mi>
    </mrow>
    </msqrt>
    </mstyle>
    </math>
    </p>
    
    

    JavaScript Content

    var height=0;
    var width=0;
    var depth=0;
    function upheight() {
      height++;
      document.getElementById("thespace").setAttribute("height",height+".1ex");
    }
    function downheight() {
      height--;
      document.getElementById("thespace").setAttribute("height",height+".1ex");
    }
    function upwidth() {
      width++;
      document.getElementById("thespace").setAttribute("width",width+".1em");
    }
    function downwidth() {
      width--;
      document.getElementById("thespace").setAttribute("width",width+".1em");
    }
    function updepth() {
      depth++;
      document.getElementById("thespace").setAttribute("depth",depth+".1ex");
    }
    function downdepth() {
      depth--;
      document.getElementById("thespace").setAttribute("depth",depth+".1ex");
    }
    
    
    

     

    Document Tags and Contributors

    Contributors to this page: fscholz
    Last updated by: fscholz,