visibility-005.html (2552B)
1 <!DOCTYPE html> 2 <html class="reftest-wait"> 3 <head> 4 <meta charset="utf-8"> 5 <title>visibility</title> 6 <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> 7 <link rel="help" href="https://w3c.github.io/mathml-core/#css-styling"> 8 <link rel="help" href="https://w3c.github.io/mathml-core/#operator-fence-separator-or-accent-mo"> 9 <link rel="match" href="visibility-005-ref.html"/> 10 <meta name="assert" content="Verify that visibility=hidden is used for normal, stretchy and large operators."> 11 <style> 12 math { 13 font: 20px/1 Ahem; 14 } 15 @font-face { 16 font-family: operators; 17 src: url("/fonts/math/operators.woff"); 18 } 19 mo { 20 font-family: operators; 21 } 22 </style> 23 </head> 24 <body> 25 <p>Test passes if you see a green square.</p> 26 <div style="background: green; color: red; width: 200px; height: 200px;"> 27 <math> 28 <!-- unstretched operators --> 29 <mo style="visibility: hidden">⥯</mo> 30 <mo style="visibility: hidden">+</mo> 31 <mo style="visibility: hidden">-</mo> 32 </math> 33 <math displaystyle="true"> 34 <!-- large operator --> 35 <mo largeop="true" style="visibility: hidden">⥯</mo> 36 </math> 37 <math> 38 <mrow> 39 <!-- stretchy, small size --> 40 <mspace height="2em"/> 41 <mo style="visibility: hidden">⥯</mo> 42 </mrow> 43 </math> 44 <math> 45 <mrow> 46 <!-- stretchy, large size --> 47 <mspace height="4em"/> 48 <mo style="visibility: hidden">⥯</mo> 49 </mrow> 50 </math> 51 <div id="dynamic"> 52 <math> 53 <!-- unstretched operators --> 54 <mo stretchy="false">⥯</mo> 55 <mo>+</mo> 56 <mo>-</mo> 57 </math> 58 <math displaystyle="true"> 59 <!-- large operator --> 60 <mo largeop="true">⥯</mo> 61 </math> 62 <math> 63 <mrow> 64 <!-- stretchy, small size --> 65 <mspace height="2em"/> 66 <mo>⥯</mo> 67 </mrow> 68 </math> 69 <math> 70 <mrow> 71 <!-- stretchy, large size --> 72 <mspace height="4em"/> 73 <mo>⥯</mo> 74 </mrow> 75 </math> 76 </div> 77 </div> 78 <script src="/mathml/support/fonts.js"></script> 79 <script> 80 window.addEventListener("load", () => loadAllFonts().then(() => { 81 document.getElementById("dynamic").style.visibility = "hidden"; 82 document.documentElement.classList.remove("reftest-wait"); 83 })); 84 </script> 85 <script src="/mathml/support/feature-detection.js"></script> 86 <script>MathMLFeatureDetection.ensure_for_match_reftest("has_menclose");</script> 87 </body> 88 </html>