Results 1 to 2 of 2

Thread: OpenType feature demonstration script not working

  1. #1
    Join Date
    Feb 2007
    Location
    🌎
    Posts
    528
    Thanks
    10
    Thanked 10 Times in 10 Posts
    Blog Entries
    2

    Default OpenType feature demonstration script not working

    Okay, I'm stumped. Why doesn't this work?
    Code:
    <table width="100%" border="0">
      <tr>
        <td><textarea name="textarea-071010" id="textarea-071010" cols="100%" rows="20" style="font: normal normal 12pt 'Adobe Caslon Pro'; font-variant-ligatures: common-ligatures additional-ligatures historical-ligatures; font-variant-alternates: stylistic(01) contextual styleset(01) swash(01) contextual-swash(01);">Adobe Caslon Pro</textarea></td>
        <td width="300">
          <p><label for="dropdown-071010">Style</label>
            <select name="dropdown-071010" id="dropdown-071010">
              <option selected onClick="document.getElementById('textarea-071010').style += 'font-weight: 400;font-style: normal;'">Regular</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-weight: 400;font-style: italic;'">Italic</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-weight: 600;font-style: normal;'">Semibold</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-weight: 600;font-style: italic;'">Semibold Italic</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-weight: 700;font-style: normal;'">Bold</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-weight: 700;font-style: italic;'">Bold Italic</option>
            </select>
            <br>
            <label for="stylistic-071010">Stylistic Alternates</label>
            <select name="stylistic-071010" id="stylistic-071010">
              <option onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: stylistic(00); font-variant-alternates: styleset(00);'">Off</option>
              <option selected onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: stylistic(01);font-variant-alternates: styleset(01);'">Set 1</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: stylistic(02);font-variant-alternates: styleset(02);'">Set 2</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: stylistic(03);font-variant-alternates: styleset(03);'">Set 3</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: stylistic(04);font-variant-alternates: styleset(04);'">Set 4</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: stylistic(05);font-variant-alternates: styleset(05);'">Set 5</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: stylistic(06);font-variant-alternates: styleset(06);'">Set 6</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: stylistic(07);font-variant-alternates: styleset(07);'">Set 7</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: stylistic(08);font-variant-alternates: styleset(08);'">Set 8</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: stylistic(09);font-variant-alternates: styleset(09);'">Set 9</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: stylistic(10);font-variant-alternates: styleset(10);'">Set 10</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: stylistic(11);font-variant-alternates: styleset(11);'">Set 11</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: stylistic(12);font-variant-alternates: styleset(12);'">Set 12</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: stylistic(13);font-variant-alternates: styleset(13);'">Set 13</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: stylistic(14);font-variant-alternates: styleset(14);'">Set 14</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: stylistic(15);font-variant-alternates: styleset(15);'">Set 15</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: stylistic(16);font-variant-alternates: styleset(16);'">Set 16</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: stylistic(17);font-variant-alternates: styleset(17);'">Set 17</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: stylistic(18);font-variant-alternates: styleset(18);'">Set 18</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: stylistic(19);font-variant-alternates: styleset(19);'">Set 19</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: stylistic(20);font-variant-alternates: styleset(20);'">Set 20</option>
            </select>
            <br>
            <label for="figure-071010">Figure Style</label>
            <select name="figure-071010" id="figure-071010">
              <option selected onClick="document.getElementById('textarea-071010').style += 'font-variant-numeric: proportional-nums;'">Proportional</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-variant-numeric: tabular-nums;'">Tabular</option>
            </select>
            <select name="numtype-071010" id="numtype-071010">
              <option selected onClick="document.getElementById('textarea-071010').style += 'font-variant-numeric: oldstyle-nums;'">Old-style</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-variant-numeric: lining-nums;'">Lining</option>
            </select>
            <br>
            <label for="size-071010">Size (points)</label>
            <select name="size-071010" id="size-071010">
              <option onClick="document.getElementById('textarea-071010').style += 'font-size: 8pt;'">8</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-size: 10pt;'">10</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-size: 11pt;'">11</option>
              <option selected onClick="document.getElementById('textarea-071010').style += 'font-size: 12pt;'">12</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-size: 14pt;'">14</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-size: 16pt;'">16</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-size: 18pt;'">18</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-size: 20pt;'">20</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-size: 22pt;'">22</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-size: 24pt;'">24</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-size: 26pt;'">26</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-size: 28pt;'">28</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-size: 32pt;'">32</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-size: 48pt;'">48</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-size: 72pt;'">72</option>
              <option onClick="document.getElementById('textarea-071010').style += 'font-size: 96pt;'">96</option>
            </select>
          </p>
        <p>
          <select name="ligatures-071010" id="ligatures-071010"><option selected onClick="document.getElementById('textarea-071010').style += 'font-variant-ligatures: common-ligatures;'">On</option><option onClick="document.getElementById('textarea-071010').style += 'font-variant-ligatures: no-common-ligatures;'">Off</option></select>
          <label for="ligatures-071010">Standard Ligatures</label>
          <br>
          <select name="discretionary-071010" id="discretionary-071010"><option selected onClick="document.getElementById('textarea-071010').style += 'font-variant-ligatures: additional-ligatures;font-variant-ligatures: historical-ligatures;'">On</option><option onClick="document.getElementById('textarea-071010').style += 'font-variant-ligatures: no-additional-ligatures;font-variant-ligatures: no-historical-ligatures;'">Off</option></select>
          <label for="discretionary-071010">Discretionary Ligatures
          </label><br>
    (Last half coming soon, it cut me off)
    ....(o_ Penguins
    .---/(o_- techno_racing
    +(---//\-' in
    .+(_)--(_)' The McMurdo 500

  2. #2
    Join Date
    Feb 2007
    Location
    🌎
    Posts
    528
    Thanks
    10
    Thanked 10 Times in 10 Posts
    Blog Entries
    2

    Default

    Code:
          <select name="smallcaps-071010" id="smallcaps-071010"><option onClick="document.getElementById('textarea-071010').style += 'font-variant-caps: small-caps;'">On</option><option selected onClick="document.getElementById('textarea-071010').style += 'font-variant-caps: normal;'">Off</option></select>
          <label for="smallcaps-071010">Small Caps</label>
          <br>
          <select name="swash-071010" id="swash-071010"><option selected onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: swash(01); font-variant-alternates: contextual-swash(01)'">On</option><option onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: swash(00); font-variant-alternates: contextual-swash(00);'">Off</option></select>
          <label for="swash-071010">Swash</label>
          <br>
          <select name="contextual-071010" id="contextual-071010"><option selected onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: contextual;'">On</option><option onClick="document.getElementById('textarea-071010').style += 'font-variant-alternates: no-contextual;'">Off</option></select>
          <label for="contextual-071010">Contextual Alternates</label>
    <br>
          <br>
        </p></td>
      </tr>
    </table>
    (Yay, 500th post.)
    ....(o_ Penguins
    .---/(o_- techno_racing
    +(---//\-' in
    .+(_)--(_)' The McMurdo 500

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •